使 UICollectionViewCell 出现在 UICollectionView 的中心

Posted

技术标签:

【中文标题】使 UICollectionViewCell 出现在 UICollectionView 的中心【英文标题】:Make UICollectionViewCell appear in center of UICollectionView 【发布时间】:2013-08-23 16:02:12 【问题描述】:

我有一些动态添加到UICollectionView 的单元格。我想做的是更改这些单元格的插图,使它们出现在UICollectionView 的中心。这是因为添加的单元格越多,单元格高度就会发生变化(它是单行UICollectionView)。

- (UIEdgeInsets)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section 
    // This method is used to center when one tile is entered else use a standard no inset
    if (self.wordArray.count == 1) 
        CGFloat newWidth = (self.tileCollectionView.bounds.size.width - self.tileCollectionView.bounds.size.height);
        return UIEdgeInsetsMake(0, (newWidth / 2), 0, (newWidth/2));
     else 
        return UIEdgeInsetsMake(0, 0, 0, 0); // top, left, bottom, right
    

我如何获得对 UICollectionViewCell 当前高度的引用,因为它们的形状都相同(只是它们的高度/宽度会在添加更多以继续适合一行时发生变化。

一旦我参考了单元格高度,我可以添加如下内容: self.tileCollectionView.bounds.size.height - CELLHEIGHT /2 -- 用作单元格的插图。

【问题讨论】:

【参考方案1】:

如果所有单元格的大小都相同并且假设您使用的是UICollectionViewFlowLayout,您可以使用它来获取它们的大小:

UICollectionViewFlowLayout *flowLayout = (UICollectionViewFlowLayout *)self.collectionView.collectionViewLayout;
CGFloat width = flowLayout.itemSize.width;
CGFloat height = flowLayout.itemSize.height;

这就是我使用UICollectionViewFlowLayout 计算插图的方式:

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section 
    UICollectionViewFlowLayout *flowLayout = (UICollectionViewFlowLayout *)self.collectionView.collectionViewLayout;
    NSInteger numberOfCells = self.view.frame.size.width / flowLayout.itemSize.width;
    NSInteger edgeInsets = (self.view.frame.size.width - (numberOfCells * flowLayout.itemSize.width)) / (numberOfCells + 1);
    return UIEdgeInsetsMake(0, edgeInsets, 0, edgeInsets);

您还需要确保在屏幕旋转时使布局无效,以使其再次计算新的插图:

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration

    [super willRotateToInterfaceOrientation:toInterfaceOrientation duration:duration];
    [self.collectionView.collectionViewLayout invalidateLayout];

【讨论】:

【参考方案2】:

如果您使用的是网格样式的布局,我会尝试以下方法: collectionView:layout:sizeForItemAtIndexPath:

您需要实现 UICollectionViewFlowLayoutDelegate 才能这样做。要让它们堆叠,请将最小偏移量设置为单元格本身大小的负数。这可能需要一些试验和错误。

【讨论】:

是的,我已经使用此方法更改单元格大小。我想要做的是从另一种方法中找出单元格大小,即问题中的那个。如何确定单元格大小,以便计算出插图以使它们在集合视图高度内居中对齐? 您需要在某处引用单元格(或只是其大小)。我会把它放在一个变量中以便于访问。 好的,我接受我只是在单元格创建方法中放置一个变量来保存大小并稍后使用它。谢谢

以上是关于使 UICollectionViewCell 出现在 UICollectionView 的中心的主要内容,如果未能解决你的问题,请参考以下文章

UICollectionViewCell -- 使 selectedBackgroundView 比单元格本身大

Swift:使 UIGestureRecognizer 只影响一个 UICollectionViewCell 而不是全部

使 UICollectionViewCell 的一部分不可点击

处理 UICollectionViewCell 中的滚动视图项目(单元格未出现)

当 UICollectionViewCell 在 xib 中时连接插座出现问题

将 UILabel 添加到自定义 UICollectionViewCell 不会出现在 cellForItemAtIndexPath 中