先来编写第一个界面：推荐页面

新建第一个推荐界面的控制器：类型为：UIViewController  ， RecommendViewController

创建后删除无用代码

来到HomeViewController 在之前创建控制器的地方，进行修改。之前是使用for循环创建了4个控制器，这里逐步用独立新建的控制器来替代之前的控制器。

给控制器添加颜色，可以在界面上进行展现：

importUIKit

class RecommendViewController:UIViewController{

overridefuncviewDidLoad() {

super.viewDidLoad()

view.backgroundColor=UIColor.blue

}

}

背景设置成蓝色

运行效果：

把之前的View的背景颜色删掉：

开始搭建UI框架

然后开始创建一个CollectionView。

创建懒加载的collectionView 并对布局进行配置

设置collectionView的背景颜色为红色，方便查看

在创建UI方法中添加collection显示的界面上

查看运行效果：

显示红色，但是里面没有item，因为还没设置数据源

设置collection的数据源

遵循collectionView的数据源的协议

定义两个cell 标识的常量：cell 和header

在collectionView注册Cell

在Cell数据源配置的dequeueReusableCell填写注册的Cell

为了能显示cell，给cell设置背景颜色

运行效果

接下来设置标题，组头

先注册组头

//注册分组的头

collectionView.register(UICollectionReusableView.self, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: kHeaderViewID)

在Cell 配置中进行编写，设置背景颜色为绿色

运行效果：