前情提要
????iOS13對CollectionView進行了大的更新之后,一個CollectionView幾乎可以應對開發(fā)中90%的UI需求棺牧。
????開發(fā)過程中,我們不再需要思考"怎么做"而是"需要什么"。比如有些CollectionView嵌套CollectionView或者TableView甚至ScrollView的問題截歉,無論是UI,數(shù)據(jù)源烟零,還是邊界滑動問題都會讓人頭大瘪松,效率很低。
? ? 本文依據(jù)WWDC2019/20關于CollectionView的session锨阿,與大家共同學習宵睦。
正文內(nèi)容
示例代碼:
1.GridViewController:
從最簡單的入手來看CollectionView的基本使用:
一:把CollectionView添加到控制器上,就是代碼中的configureHierarchy()方法墅诡;
二:寫布局壳嚎,也就是createLayout()方法;
下圖是iOS13中CollectionView中的布局關系:
所以在createLayout中需要我們配置itemSize,groupSize,以及section;
private func createLayout() -> UICollectionViewLayout {
//fractionalWidth:?dimension is computed as a fraction of the width of the containing group
//fractionalHeight:?dimension is computed as a fraction of the height of the containing group
//absolute:?dimension with an absolute point value
//estimated:?dimension is estimated with a point value. Actual size will be determined when the content is rendered.
? ? ? ? let?itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(0.2),
?? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? heightDimension: .fractionalHeight(1.0))
? ? ? ? let?item = NSCollectionLayoutItem(layoutSize: itemSize)
? ? ? ? let?groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1.0),
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? heightDimension: .fractionalWidth(0.2))
? ? ? ? let?group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize,
?? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? subitems: [item])
? ? ? ? let?section = NSCollectionLayoutSection(group: group)
? ? ? ? let?layout = UICollectionViewCompositionalLayout(section: section)
? ? ? ? return?layout
? ? }
三:處理數(shù)據(jù)源,也就是configureDataSource()方法:
private func configureDataSource() {
//注冊cell 系統(tǒng)默認給了3個cell,Text..,List..,Label..也可以自定義cell
? ? ? ? let?cellRegistration =UICollectionView.CellRegistration<TextCell, Int> { (cell, indexPath, identifier)in
? ? ? ? ? ? // Populate the cell with our item description.
? ? ? ? ? ? cell.label.text="\(identifier)"
? ? ? ? ? ? cell.contentView.backgroundColor = .cornflowerBlue
? ? ? ? ? ? cell.layer.borderColor = UIColor.black.cgColor
? ? ? ? ? ? cell.layer.borderWidth=1
? ? ? ? ? ? cell.label.textAlignment= .center
? ? ? ? ? ? cell.label.font=UIFont.preferredFont(forTextStyle: .subheadline)
? ? ? ? }
? ? ? ? dataSource = UICollectionViewDiffableDataSource<Section, Int>(collectionView: collectionView) {
? ? ? ? ? ? (collectionView:UICollectionView, indexPath:IndexPath, identifier:Int) ->UICollectionViewCell?in
? ? ? ? ? ? // Return the cell.
? ? ? ? ? ? return?collectionView.dequeueConfiguredReusableCell(using: cellRegistration, for: indexPath, item: identifier)
? ? ? ? }
? ? ? ? // initial data
//?snapshot
// Truth of UI state
// Unique identifiers for sections and items
// No more IndexPaths
//?snapshot還有很多方法,足夠處理UI變化的方方面面
? ? ? ? var snapshot = NSDiffableDataSourceSnapshot<Section, Int>()
? ? ? ? snapshot.appendSections([.main])
? ? ? ? snapshot.appendItems(Array(0..<94))
// 更新末早,提交數(shù)據(jù)
? ? ? ? dataSource.apply(snapshot, animatingDifferences:false)
? ? }