UICollectionView 单元格显示不正确

Question

在我的水平 CollectionView 中，没有正确显示视图。为什么？

下图中粉红色的是CollectionView，橙色的是cell，为什么cell显示的很奇怪。对于单元格 1，右侧为 space，对于单元格 2，左侧为 space，而对于单元格 3，左侧的大小略有增加。为什么会有这种奇怪的行为？

这是我的代码：

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

// The cell that is returned must be retrieved from a call to -dequeueReusableCellWithReuseIdentifier:forIndexPath:
- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
        CollectionViewCell* cell = (CollectionViewCell*)[collectionView dequeueReusableCellWithReuseIdentifier:@"pagerCell" forIndexPath:indexPath];
        [cell.PagerViewCell addSubview:  [[[NSBundle mainBundle] loadNibNamed:@"AlbumsView" owner:self options:nil] objectAtIndex:0]];

    return cell;
}

- (CGSize)collectionView:(UICollectionView *)collectionView
                  layout:(UICollectionViewLayout*)collectionViewLayout
  sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    return CGSizeMake(pagerView.frame.size.width    , pagerView.frame.size.height);
}

-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{
    return 1;
}

- (void)viewWillLayoutSubviews
{
    [super viewWillLayoutSubviews];
    [pagerView.collectionViewLayout invalidateLayout];
}

它的显示是这样的

和单元格 2

和单元格 3

Answer 1

你必须为此使用 UICollectionView 的委托方法，你必须为每个 Cell 提到你的 itemSize。

像这样创建一个 UICollectionViewFlowLayout：

   UICollectionViewFlowLayout *layOut = [[UICollectionViewFlowLayout alloc] init]; 

   layOut.itemSize = CGSizeMake(cellWidth, cellHeight);

   layOut.scrollDirection = UICollectionViewScrollDirectionHorizontal;

   layOut.minimumInteritemSpacing = 0;

   layOut.minimumLineSpacing = 0;
   yourCollectionViewObject.collectionViewLayout = layOut;

并使用此委托方法：

-(CGSize)collectionView:(UICollectionView *)collectionView
              layout:(UICollectionViewLayout *)collectionViewLayout  sizeForItemAtIndexPath:(NSIndexPath *)indexPath

  {
     CGSize itemSize = CGSizeMake(cellWidth, cellHeight);

    return itemSize;
  }

Answer 2

在您的 class 中添加此方法并进行更改，直到您需要为止。

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
    return UIEdgeInsetsMake(0, 0, 0, 0);
}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{
    return 10.0f;
}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section
{
    return 10.0f;
}

Answer 3

您添加到集合视图单元格的子视图似乎没有设置。问题在这里：

// The cell that is returned must be retrieved from a call to -dequeueReusableCellWithReuseIdentifier:forIndexPath:
- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
        CollectionViewCell* cell = (CollectionViewCell*)[collectionView dequeueReusableCellWithReuseIdentifier:@"pagerCell" forIndexPath:indexPath];
        [cell.PagerViewCell addSubview:  [[[NSBundle mainBundle] loadNibNamed:@"AlbumsView" owner:self options:nil] objectAtIndex:0]];

    return cell;
}

您只是在调用 addSubview 但您没有在要添加的子视图上添加任何类型的约束。它应该是这样的：

// The cell that is returned must be retrieved from a call to -dequeueReusableCellWithReuseIdentifier:forIndexPath:
- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
        CollectionViewCell* cell = (CollectionViewCell*)[collectionView dequeueReusableCellWithReuseIdentifier:@"pagerCell" forIndexPath:indexPath];
        UIView *albumsView = [[[NSBundle mainBundle] loadNibNamed:@"AlbumsView" owner:self options:nil] objectAtIndex:0]
        [cell.PagerViewCell addSubview: albumsView];

        // Adding constraints: 
        NSDictionary *viewsDictionary = NSDictionaryOfVariableBindings(albumsView);
        [cell.PagerViewCell addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[albumsView]|" options:0 metrics:nil views:viewsDictionary]];
        [cell.PagerViewCell addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[albumsView]|" options:0 metrics:nil views: viewsDictionary]];

    return cell;
}

约束使您的 albumView 填充单元格。据我了解，这是预期的效果。

如果您使用 PureLayout 之类的东西，约束部分看起来会简单得多。

让我知道它是否适合你

UICollectionView 单元格显示不正确

UICollectionView cells are not displayed properly

ios

objective-c

uicollectionview

uicollectionviewcell

uicollectionviewlayout