关于collectionview布局的坑

不知道写了多少次collectionview，步了很多坑，现在看来虽然达到了自己想要的结果，却不知道其中所以然。还是总结一下，免得再走弯路；

场景是这样的，我要定制一个显示选择图片的排列，想要实现横向排列4个，等间距，多了折行显示的效果，正确的做法是这样的；

- (void)viewDidLoad {
    [super viewDidLoad];
    self.navigationController.navigationBar.translucent = NO;
    if ([self respondsToSelector:@selector(setAutomaticallyAdjustsScrollViewInsets:)]) {
        self.automaticallyAdjustsScrollViewInsets = NO;
    }
    self.view.backgroundColor = [UIColor purpleColor];
    self.photoArray = @[[UIImage imageNamed:@"cycle3"],[UIImage imageNamed:@"cycle4"],[UIImage imageNamed:@"cycle2"],[UIImage imageNamed:@"cycle3"],[UIImage imageNamed:@"cycle4"],].mutableCopy;
    [self.view addSubview:self.pickPhotoCollection];
}

-(UICollectionView *)pickPhotoCollection{
    if (!_pickPhotoCollection) {
        UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
        layout.scrollDirection = UICollectionViewScrollDirectionVertical;
        _pickPhotoCollection = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 200, kScreenWidth, (self.photoArray.count/4 +1)*80) collectionViewLayout:layout];
        _pickPhotoCollection.delegate = self;
        _pickPhotoCollection.dataSource = self;
        _pickPhotoCollection.backgroundColor = RGBACOLOR(240, 240, 240, 1);
        _pickPhotoCollection.showsHorizontalScrollIndicator = NO;

        [_pickPhotoCollection registerClass:[XJPickPhotoCollectionViewCell class] forCellWithReuseIdentifier:NSStringFromClass([XJPickPhotoCollectionViewCell class])];
    }
    return _pickPhotoCollection;
}
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 1;
}

-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return self.photoArray.count + 1 > 9 ? 9 : self.photoArray.count +1;
}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{

    XJPickPhotoCollectionViewCell *cell = (XJPickPhotoCollectionViewCell *)[collectionView dequeueReusableCellWithReuseIdentifier:NSStringFromClass([XJPickPhotoCollectionViewCell class]) forIndexPath:indexPath];
    //判断图片的显示方式   如果不是9张图 则显示可以继续添加
    if (self.photoArray.count == 9) {
        cell.photoImageView.image = self.photoArray[indexPath.row];
        return cell;
    }

    if (indexPath.row == self.photoArray.count) {
        cell.photoImageView.image = [UIImage imageNamed:@"addPhoto"];
    }else{
        cell.photoImageView.image = self.photoArray[indexPath.row];
    }

    return cell;
}

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    return CGSizeMake(WidthScale(70), WidthScale(70));
}
-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{
//    return 2;
    return (kScreen_width - WidthScale(70)*4 - 10 )/3.;
}
//-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section{
//     return (kScreen_width - WidthScale(70)*4 - 10 )/3.;
//}
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
    return UIEdgeInsetsMake(5, 5, 5, 5);
}

关键点在这里：

1-===layout.scrolldirection = uicollectionViewScrollDirectionVertical;collection的滚动方向，由于要折行向下，所以方向是垂直方向，在排列的时候会默认选择先将横向排列完毕，折行向下。

2--=== minmumlinespaceing 这个这个属性用来指示行与行之间的最小距离(纵向)，或者列与列之间的最小距离(横向)。无论横向或者纵向，都可以滚动显示所有内容，所以这个属性可以单独设置。  SO 在不同的滚动方向上要分清楚他的作用，我就是在这里弄的头晕目眩；  当然interitem就很好理解了  

 

另外还有一点是   如果是自定义的layout，layout的代理方法是不会执行的，若想达到相同的效果，需要在自定义的layout内部进行处理！

        layout.scrollDirection = UICollectionViewScrollDirectionVertical;