这里是Swift简单的UICollectionView的创建和使用,
其中的CollectionViewCell是自定义的cell,
ZLLCollectionReusableView是自定义的标题头,
ZLLFootCollectionReusableView是自定义的脚部.
import UIKit
class ViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource,UICollectionViewDelegateFlowLayout {
//全局变量
var screen_width:CGFloat!
var screen_height:CGFloat!
var collectionView:UICollectionView!
//MARK: -
//MARK: init
override func viewDidLoad() {
super.viewDidLoad()
screen_height = UIScreen.main.bounds.size.height
screen_width = UIScreen.main.bounds.size.width
self.setCollectionView()
}
//MARK: -
//MARK: UI
func setCollectionView() {
//1, 流布局
let layout = UICollectionViewFlowLayout.init()
//2, 设置每个item的大小
layout.itemSize = CGSize(width: screen_width/2, height: screen_height/3)
//3, 垂直和水平滑动
// UICollectionViewScrollDirection.vertical 省略写法 .vertial
// UICollectionViewScrollDirection.horizontal 省略写法 .horizontal
layout.scrollDirection = .vertical
//4, 每个item之间的最小距离 inter 之间
layout.minimumInteritemSpacing = 10
//5, 每行之间的最小距离
layout.minimumLineSpacing = 10
//6, 定义collectionView
collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: screen_width, height: screen_height), collectionViewLayout: layout)
//7, 注册collectionViewCell
collectionView.register(UINib (nibName: "CollectionViewCell", bundle: nil), forCellWithReuseIdentifier: "CollectionViewCell")
//8, 注册header
collectionView.register(UINib (nibName: "ZLLCollectionReusableView", bundle: nil), forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "ZLLCollectionReusableView")
//设置页头尺寸
layout.headerReferenceSize = CGSize.init(width: screen_width, height: 50)
//9, 注册底部
collectionView.register(UINib (nibName: "ZLLFootCollectionReusableView", bundle: nil), forSupplementaryViewOfKind: UICollectionElementKindSectionFooter, withReuseIdentifier: "ZLLFootCollectionReusableView")
//设置底部尺寸
layout.footerReferenceSize = CGSize(width: screen_width, height: 50)
//10, 设置delegate
collectionView!.delegate = self
collectionView!.dataSource = self
//11, 分页显示效果
collectionView.isPagingEnabled = true
collectionView.backgroundColor = UIColor.white
self.view.addSubview(collectionView)
}
//MARK: -
//MARK: collection datasource
func numberOfSections(in collectionView: UICollectionView) -> Int
{
return 1
}
//必选方法
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int
{
return 8
}
func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView
{
if (kind as String) == UICollectionElementKindSectionHeader {
//返回头部
let header = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "ZLLCollectionReusableView", for: indexPath)
return header
}else
{
//返回底部
let footer = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionElementKindSectionFooter, withReuseIdentifier: "ZLLFootCollectionReusableView", for: indexPath)
return footer
}
}
//必选方法
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CollectionViewCell", for: indexPath) as!CollectionViewCell
cell.iconImageView.image = UIImage(named:"textImage")
cell.backgroundColor = UIColor.red
return cell
}
//MARK: -
//MARK: delegateFlowlayout
//返回header的大小
// func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize
// {
// return CGSize(width: screen_width, height: 50)
// }
//可以定制不同的item return: item的大小
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
{
if (indexPath as IndexPath).row % 2 == 1 {
return CGSize(width: (screen_width - 20)/2, height: screen_height/2)
}else{
return CGSize(width: (screen_width - 20)/2, height: screen_height/3)
}
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
自定义的cell是继承UICollectionViewCell
import UIKit
class CollectionViewCell: UICollectionViewCell {
//图片属性
@IBOutlet weak var iconImageView: UIImageView!
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
}
cell的头部和脚部都的自定义都是继承 UICollectionReusableView, 这和oc里是一样的
这里使用的是.xib文件, 脚和头一样,所以就只展示一下头的代码就行,其实也没什么内容,所有展示都在.xib上,我这里没有添加属性.
import UIKit
class ZLLCollectionReusableView: UICollectionReusableView {
override func awakeFromNib() {
super.awakeFromNib()
// Initialization code
}
}
网友评论