美文网首页
UICollectionView 最简单的流式布局

UICollectionView 最简单的流式布局

作者: 奇梦人 | 来源:发表于2020-04-05 19:56 被阅读0次
  1. UICollectionViewFlowLayout 是系统提供的流式布局

- (void)viewDidLoad {
    [super viewDidLoad];
    UICollectionViewFlowLayout *layout  = [[UICollectionViewFlowLayout alloc ]init];
    layout.scrollDirection = UICollectionViewScrollDirectionVertical; //设置为水平方向
    layout.minimumLineSpacing =10 ; // 垂直间隔
    layout.minimumInteritemSpacing =10; // 用来计算一行可以布局多少个 item
    layout.itemSize = CGSizeMake((self.view.frame.size.width-10)/2 , 200);
    
    UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:self.view.frame collectionViewLayout:layout];
    collectionView.backgroundColor = [UIColor whiteColor];
    [collectionView registerClass:[UICollectionViewCell class]  forCellWithReuseIdentifier:@"cellID" ];
    collectionView.delegate = self;
    collectionView.dataSource = self;
    [self.view addSubview:collectionView];
    
}

2 .实现这俩个协议 UICollectionViewDataSource,UICollectionViewDelegate

  1. 需要设置的具体方法


- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return 10;
}

// 设置流式具体布局
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cellID" forIndexPath:indexPath];
    cell.backgroundColor = [UIColor colorWithRed:arc4random()%255/255.0 green:arc4random()%255/255.0 blue:arc4random()%255/255.0 alpha:1];
    return cell;
}

// 设置 item 大小  如果一行放的下俩个会放俩个 ,放不下则换行
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    if(indexPath.item %3 == 0){
        return CGSizeMake(self.view.frame.size.width, 100);
    }else{
        return CGSizeMake((self.view.frame.size.width-10)/2 , 200);
    }
}
image.png

相关文章

网友评论

      本文标题:UICollectionView 最简单的流式布局

      本文链接:https://www.haomeiwen.com/subject/utspphtx.html