iOS - 版面实现记录一-优快云博客

本文链接：https://blog.youkuaiyun.com/CHN_liu/article/details/46324133

本文介绍如何在iOS应用中使用UICollectionViewFlowLayout设置UICollectionView的布局参数，并实现带头部视图的 UICollectionView。文中详细解释了如何注册头视图、设置布局属性如item大小、行间距等，以及如何处理scrollView中的子视图。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

版面一

这个页面为一个 collectionView。上面部分为一个 UICollectionReusableView 的 headView。该 headView 生成包括需要一下步骤

[self.contentCollectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@“headAdView"];
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];    layout.headerReferenceSize = CGSizeMake(IOS_SCREEN_WIDTH, 250.f);

实现 delegate 方法

    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
    layout.itemSize = CGSizeMake(self.frame.size.width/2-30.f, self.frame.size.width/2-6.f-70.f);
    layout.minimumLineSpacing = 10.f;
    layout.minimumInteritemSpacing = 10.f;
    layout.headerReferenceSize = CGSizeMake(IOS_SCREEN_WIDTH, 250.f);
    self.contentCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0 ,64.f , IOS_SCREEN_WIDTH, IOS_SCREEN_CONTENT_HEIGHT - BOTTOM_MENU_BAR_HEIGHT) collectionViewLayout:layout];

另外当把 View 作为一个可复用的视图时,如果该View当中有使用 scrollView，须注意把 scrollView 中的子View去除

    for (UIView *v in self.myScrollView.subviews) {
        [v removeFromSuperview];
    }