公司给的UI图要求如下
Snip20160419_2.png
这个用collection还是比较好做的
效果如下
Snip20160419_1.png
在xib里直接有footer和header的属性,如果用代码的话,贴一组代码记录一下
新建一个控制器继承UICollectionViewController
static NSString * const reuseIdentifier = @"Cell"; - (instancetype)init { // 创建瀑布流对象,设置cell的尺寸和位置 UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init]; // 设置滚动的方向 layout.scrollDirection = UICollectionViewScrollDirectionVertical; CGSize size = [UIScreen mainScreen].bounds.size; layout.itemSize = size; // 设置cell之间的间距 layout.minimumInteritemSpacing = 10; // 设置行距 layout.minimumLineSpacing = 10; layout.footerReferenceSize = CGSizeMake(size.width, 100); layout.headerReferenceSize = CGSizeMake(size.width, 50); return [super initWithCollectionViewLayout:layout]; }// 设置headerView和footerView的- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath { UICollectionReusableView *reusableView = nil; if (kind == UICollectionElementKindSectionHeader) { UICollectionReusableView *header = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView" forIndexPath:indexPath]; reusableView = header; } reusableView.backgroundColor = [UIColor greenColor]; if (kind == UICollectionElementKindSectionFooter) { UICollectionReusableView *footerview = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"FooterView" forIndexPath:indexPath]; footerview.backgroundColor = [UIColor purpleColor]; reusableView = footerview; } return reusableView; } - (void)viewDidLoad { [super viewDidLoad]; // Uncomment the following line to preserve selection between presentations // self.clearsSelectionOnViewWillAppear = NO; // Register cell classes [self.collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier]; self.collectionView.pagingEnabled = YES;// self.collectionView.bounces = NO; // 是否有边距 self.collectionView.showsHorizontalScrollIndicator = NO; [self.collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"HeaderView"]; [self.collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"FooterView"]; // Do any additional setup after loading the view.} - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated.}#pragma mark <UICollectionViewDataSource>- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { return 2; } - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return 10; } - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath]; if (indexPath.section == 0) { cell.backgroundColor = [UIColor redColor]; } else { cell.backgroundColor = [UIColor greenColor]; } return cell; }#pragma mark - UICollectionViewDelegateFlowLayout- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { return CGSizeMake(96, 100); } - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section { return UIEdgeInsetsMake(5, 5, 5, 5); }
作者:蒋昉霖
链接:https://www.jianshu.com/p/8aae41d1bb56