Swift - 带有多section分区的collectionView的使用样例
UICollectionView 组件和 UITableView 组件一样,也是可以设置多个 section(分区、分组)。每个 section 我们可以设置不同的 header 和 footer,同时每个分区内还可以显示不同数量和内容的单元格。
虽然我们也可以在 tableViewCell 中嵌入 collectionView 来实现同样的效果,但会更加麻烦些,特别是如果每个 collectionView 内单元格数量不同,collectionView 还要实现动态高度。
所以如果能满足需求的话,还是建议使用多 section 的 collectionView 来实现。
1,效果图
(1)collectView 的每一个分区对应一个月份的图书列表。
(2)分区头显示月份标题。分区尾背景设为灰色,内容为空。
(3)分区内单元格显示当月所有书籍封面图片,数量不定,分区高度自适应。

2,实现步骤
(1)打开 StoryBoard,删除默认的 View Controller。拖入一个 Collection View Controller,并将其设置为初始 VC。

(2)选中这个 Scene,点击菜单“Editor”->“Embed In”->“Navigation Controller”添加一个导航控制器。

(3)选中 Collection View,在其属性面板中保持 Layout 属性为 Flow 不变。勾选上“Section Header”和“Section Footer”,分别增加分区头和分区尾。

(4)调整好头部的尺寸,并将其 Identifier 设置为 HeaderView

(5)往头部中拖入一个 Label 并设置好相关约束。同时将 Label 的 Tag 设置为 1。

(6)调整好分区尾部的尺寸,将其背景色设为灰色。同时将其 Identifier 设置为 FooterView。

(7)调整好单元格尺寸,将其 Identifier 设置为 MyCell

(8)往单元格里拖入一个 ImageView,并设置好相关约束。同时将 ImageView 的 Tag 设为 1。

(9)选中 Collection View,在尺寸样式面包中设置好内边距和单元格间距。

(10)新建一个 CollectionViewController 类(继承 UICollectionViewController)。并在 StoryBoard 中作绑定。

(11)CollectionViewController.swift 完整代码如下
import UIKit //每月书籍 struct BookPreview { var title:String var images:[String] } class CollectionViewController: UICollectionViewController { //所有书籍数据 let books = [ BookPreview(title: "五月新书", images: ["0.jpg", "1.jpg","2.jpg", "3.jpg", "4.jpg","5.jpg","6.jpg"]), BookPreview(title: "六月新书", images: ["7.jpg", "8.jpg", "9.jpg"]), BookPreview(title: "七月新书", images: ["10.jpg", "11.jpg", "12.jpg", "13.jpg"]) ] override func viewDidLoad() { super.viewDidLoad() } //获取分区数 override func numberOfSections(in collectionView: UICollectionView) -> Int { return books.count } //获取每个分区里单元格数量 override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return books[section].images.count } //分区的header与footer override func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView { var reusableview:UICollectionReusableView! //分区头 if kind == UICollectionElementKindSectionHeader{ reusableview = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "HeaderView", for: indexPath) //设置头部标题 let label = reusableview.viewWithTag(1) as! UILabel label.text = books[indexPath.section].title } //分区尾 else if kind == UICollectionElementKindSectionFooter{ reusableview = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "FooterView", for: indexPath) } return reusableview } //返回每个单元格视图 override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { //获取单元格 let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "MyCell", for: indexPath) //设置单元格中的图片 let imageView = cell.viewWithTag(1) as! UIImageView imageView.image = UIImage(named: books[indexPath.section].images[indexPath.item]) return cell } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() } }源码下载:

good,讲解非常详细..学到了
如何在视图中使用这个UICollectionView啊