UICollectionView的头部创建

最新推荐文章于 2021-03-26 23:10:33 发布

Ocean_WANG_

最新推荐文章于 2021-03-26 23:10:33 发布

阅读量751

点赞数

分类专栏： Swift iOS UIcollectionView HeaderView

本文链接：https://blog.csdn.net/qq_24904667/article/details/52981810

版权

iOS 同时被 3 个专栏收录

24 篇文章 0 订阅

订阅专栏

Swift

8 篇文章 0 订阅

订阅专栏

UIcollectionView

1 篇文章 0 订阅

订阅专栏

UICollectionView的功能很强大，能为我们提供很多复杂界面的展示，并且还能重利用，是一个非常强大的控件。

最近在开发中大量的使用了这个控件，现在写一下它的HeaderView的创建

我主要是运用xib来创建的，下面进行详细的介绍(以头部为例)：

1>HeaderView是继承自UICollectionReusableView的，这是一个非常特殊的地方，需要注意，代码我是用Swift实现的:

2>设置其尺寸，它的尺寸大小是用自定义的layout来实现的

let layout = UICollectionViewFlowLayout()
//设置头部的大小
layout.headerReferenceSize = CGSize(width: kScreenW, height: kHeaderViewH)

3>注册headerView

//注册header
collectionView.register(UINib(nibName: "SLCollectionHeaderView", bundle: nil), forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: kHeaderViewReuseIdentifier)

特别提示：第二个参数(也就是kind后面的参数):通过更换它指定为头部还是尾部，此处是头部。

UICollectionElementKindSectionHeader: 头部

UICollectionElementKindSectionFooter: 尾部

4>然后定义头部显示内容的方法，此方法为UIcollectionView的数据源方法:

func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
        
        let headerView = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: kHeaderViewReuseIdentifier, for: indexPath) as! SLCollectionHeaderView
        
        //标题
        headerView.titleLabel.text = "全部"
        //隐藏更多按钮
        headerView.moreButton.isHidden = true
        //设置图片
        headerView.iconImageView.image = UIImage(named: "Img_orange")
        
        return headerView
    }

通过以上方法就能设置UIcollectionView的头部或者尾部了