UICollectionView显示HeaderView FooterView 不如UITableView那么容易,常用会有两种做法:
1.Xib或者Storyboard 在属性一栏中设置一下:

如图所示,
2.代码设计Section的header和Footer:
好多都在找UICollectionView是否有这么个属性,比如上图说到Accessories
什么的,其实不然。大家首先要搞明白意见事情,header和footer是追加视图,属于layout
中的所以要代码设置section要在UICollectionViewFlowLayout:
- (UICollectionViewFlowLayout *) flowLayout{
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
flowLayout.。。。。。。//各属性设置
flowLayout.headerReferenceSize = CGSizeMake(320.0f, 50.0f); //设置headerView大小
flowLayout.footerReferenceSize = CGSizeMake(320.0f, 50.0f); // 设置footerView大小
return flowLayout;
}
如果你用的是Xib或者Storyboard,不想在上图属性设置,想用代码:
- (void)viewDidLoad
{
[super viewDidLoad];
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
flowLayout.headerReferenceSize = CGSizeMake(320.0f, 50.0f); //设置headerView大小
[self.collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView"]; // 一定要设置
[self.collectionView setCollectionViewLayout:layout];
//(这部分说明可以参见xib设置sectionview)
}
- (UICollectionReusableView *) collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
UICollectionReusableView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView" forIndexPath:indexPath];
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, WINSIZE.width, WINSIZE.width*7/15)];
[imageView sd_setImageWithURL:[NSURL URLWithString:[UMOnlineConfig getConfigParams:@"GuizeImageUrl"]] placeholderImage:kDefaultImage192_124];
[headerView addSubview:imageView];
return headerView;
}
运行结果:

【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步