其他
Swift中UICollectionView的使用
Swift已经发展到3.0了，相应的方法也已经发展成熟。相对于OC来说，Swift真的是太简练了，和乔布斯乔老爷子的大道至简的思想非常吻合。 好吧，废话不多说了，直接进入主题－－Swift中UICollectionView的使用。
下面先分步骤讲解UICollectionView的创建，最后再附上完整代码。
定义collectionView的布局类型，流式布局
let layout = UICollectionViewFlowLayout()设置item（cell）的大小
layout.itemSize = CGSize(width: width/2, height: height/3)设置滑动方向
/** 默认方向是垂直 UICollectionViewScrollDirection.vertical 省略写法是.vertical 水平方向 UICollectionViewScrollDirection.horizontal 省略写法是.horizontal */layout.scrollDirection = .vertical设置每个item之间最小的间距
layout.minimumInteritemSpacing = 0设置每行之间最小的间距
layout.minimumLineSpacing = 0定义一个UICollectionView
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: width, height: height), collectionViewLayout: layout) collectionView.backgroundColor = UIColor.red设置collectionView的代理 (注意：设置完代理之后会有错误，原因是代理的必要方法没有实现)
collectionView.delegate = selfcollectionView.dataSource = selfcollectionViewCell的注册
collectionView.register(UINib(nibName: "CollectionViewCell", bundle: nil), forCellWithReuseIdentifier: "MyCell")header 的注册
collectionView.register(UICollectionReusableView.self, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "headView")加载collectionView
self.view.addSubview(collectionView)
实现collectionView的相关代理方法
使用关键字extension继承代理，方法如下
extension MainViewController: UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayoutnumberOfSections方法，该方法为
可选方法，返回sections的个数，默认return 1// MARK: UICollectionViewDataSource 代理方法func numberOfSections(in collectionView: UICollectionView) -> Int {return 1}numberOfItemsInSection方法，该方法为
必选方法，返回section中item的个数// MARK: UICollectionviewDataSource 代理方法func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return 8}cellForItemAt方法，该方法为
必选方法，返回绘制collectionView的cell// MARK: UICollectionviewDataSource 代理方法func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "MyCell", for: indexPath) as! CollectionViewCell cell.imageView.image = UIImage(named: "\((indexPath as NSIndexPath).row + 2).png") cell.label.text = "美景\((indexPath as NSIndexPath).row + 1)" return cell }didSelectItemAt方法，该方法为
可选方法，当点击某个item之后的响应// MARK: UICollectionViewDelegate的代理方法func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { print("(\((indexPath as NSIndexPath).section), \((indexPath as NSIndexPath).row))") }referenceSizeForHeaderInSection方法，该方法为
可选方法，return: header的大小// MARK: UICollectionViewDelegateFlowLayout的代理方法func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize { return CGSize(width: width, height: 17) }sizeForItemAt方法，该方法为
可选方法，return: item的大小// MARK: UICollectionViewDelegateFlowLayout的代理方法func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { if (indexPath as NSIndexPath).row % 2 == 1 { return CGSize(width: width/2, height: height/3) } else { return CGSize(width: width/2, height: height/2) } }
完整代码
class MainViewController: UIViewController { // 屏幕的宽和高
let width = UIScreen.main.bounds.width
let height = UIScreen.main.bounds.height
override func viewDidLoad() { super.viewDidLoad() // 加载UICollectionView
self.setupCollectionView()
} // MARK: 加载UICollectionView
func setupCollectionView() { // 1. 定义collectionView的布局类型，流布局
let layout = UICollectionViewFlowLayout() // 2. 设置cell的大小
layout.itemSize = CGSize(width: width/2, height: height/3) // 3. 滑动方向
/**
默认方向是垂直
UICollectionViewScrollDirection.vertical 省略写法是.vertical
水平方向
UICollectionViewScrollDirection.horizontal 省略写法是.horizontal
*/
layout.scrollDirection = .vertical
// 4. 每个item之间最小的间距
layout.minimumInteritemSpacing = 0
// 5. 每行之间最小的间距
layout.minimumLineSpacing = 0
// 6. 定义一个UICollectionView
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: width, height: height), collectionViewLayout: layout)
collectionView.backgroundColor = UIColor.red
// 7. 设置collectionView的代理和数据源
collectionView.delegate = self
collectionView.dataSource = self; // 8. collectionViewCell的注册
collectionView.register(UINib(nibName: "CollectionViewCell", bundle: nil), forCellWithReuseIdentifier: "MyCell") // 9. header 的注册
collectionView.register(UICollectionReusableView.self, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "headView") self.view.addSubview(collectionView)
}
}
extension MainViewController: UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout { // MARK: UICollectionViewDataSource 代理方法
/**
该方法为可选方法，默认为1
return: collectionView中section的个数
*/
func numberOfSections(in collectionView: UICollectionView) -> Int { return 1
} // MARK: UICollectionviewDataSource 代理方法
/**
改方法为必选方法
return: section中的item的个数
*/
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return 8
} // MARK: UICollectionviewDataSource 代理方法
/**
改方法为必选方法
return: 绘制collectionView的cell
*/
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "MyCell", for: indexPath) as! CollectionViewCell
cell.imageView.image = UIImage(named: "\((indexPath as NSIndexPath).row + 2).png")
cell.label.text = "美景\((indexPath as NSIndexPath).row + 1)"
return cell
} // MARK: UICollectionViewDelegate的代理方法
/**
Description: 当点击某个item之后的回应
*/
func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
print("(\((indexPath as NSIndexPath).section), \((indexPath as NSIndexPath).row))")
} // MARK: UICollectionViewDelegateFlowLayout的代理方法
/**
return: header的大小
*/
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize { return CGSize(width: width, height: 17)
} /**
可以定制不同的item
return： item的大小
*/
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize { if (indexPath as NSIndexPath).row % 2 == 1 { return CGSize(width: width/2, height: height/3)
} else { return CGSize(width: width/2, height: height/2)
}
}
}结语
如果疏漏，请大家批评指正，也可以在文章下方评论，相互交流，相互学习。
扫描二维码
关注更多精彩