8

如何在UICollectionViewusing中垂直和水平居中所有单元格UICollectionViewFlowLayout

流布局根据滚动方向在右侧或底部留下间距。我想在所有方面设置相同的填充。我玩过sectionInset.UICollectionViewFlowLayout

4

3 回答 3

5

我建议实施该UICollectionViewDelegateFlowLayout协议以动态实现单元格的水平和垂直居中。从UICollectionViewDelegateFlowLayout 协议参考

UICollectionViewDelegateFlowLayout 协议定义了允许您与 UICollectionViewFlowLayout 对象协调以实现基于网格的布局的方法。该协议的方法定义了项目的大小和网格中项目之间的间距。

该协议中的所有方法都是可选的。如果您不实现特定方法,则流布局委托将使用其自身属性中的值来获取适当的间距信息。

流布局对象期望集合视图的委托对象采用此协议。因此,在分配给您的集合视图的委托属性的对象上实现此协议。

您可能对collectionView:layout:insetForSectionAtIndex:可用于调整屏幕所有四个侧面的插图的方法最感兴趣,例如UIEdgeInsetsMake. 您可以通过从相应的屏幕尺寸(垂直或水平)中减去适当的数量(例如单元格的大小)来根据屏幕尺寸确定插图。然后,除以 2 以获得特定维度的相等插图。

于 2013-03-12T11:32:10.503 回答
1

使用截面插图?

好吧,试着玩弄 minimumLineSpacing 属性和 minimumInteritemSpacing 属性

最小线间距

对于垂直滚动网格,此行间距表示连续行之间的最小间距。对于水平滚动网格,此值表示连续列之间的最小间距。此间距不适用于页眉和第一行之间或最后一行和页脚之间的空间。

minimumInteritemSpacing

对于垂直滚动网格,此间距表示同一行中项目之间的最小间距。对于水平滚动网格,此值表示同一列中项目之间的最小间距。这个间距是用来计算一行可以放多少个item,但是在item个数确定后,实际间距可能会向上调整。

于 2013-03-12T07:51:21.053 回答
-1

子类UICollectionViewFlowLayout化并覆盖该layoutAttributesForElementsInRect:方法以对齐您的UICollectionViewCells

-(NSArray*)layoutAttributesForElementsInRect:(CGRect)rect {

NSArray* array = [super layoutAttributesForElementsInRect:rect];
CGRect visibleRect;
visibleRect.origin = self.collectionView.contentOffset;
visibleRect.size = self.collectionView.bounds.size;

for(UICollectionViewLayoutAttributes* attributes in array) {

    if(CGRectIntersectsRect(attributes.frame, rect)){

        CGFloat d = UIInterfaceOrientationIsPortrait(_orientation)?
        CGRectGetMidY(visibleRect)-attributes.center.y :
        CGRectGetMidX(visibleRect)-attributes.center.x;

        CGFloat w = visibleRect.size.width;
        CGFloat h = visibleRect.size.height;

        CGFloat dRatio = UIInterfaceOrientationIsPortrait(_orientation)? d/(h/2) : d/(w/2);

        CGFloat angle = MAX_ANGLE*dRatio; // an angle between 0 and MAX_ANGLE based on proximity to center
        CGFloat radians = DEGREES_TO_RADIANS(angle);

        debug = 0;

        CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
        rotationAndPerspectiveTransform.m34 = PERSPECTIVE;

        rotationAndPerspectiveTransform = UIInterfaceOrientationIsPortrait(_orientation)?
        CATransform3DRotate(rotationAndPerspectiveTransform, radians, 1.0f, 0.0f, 0.0f) :
        CATransform3DRotate(rotationAndPerspectiveTransform, radians, 0.0f, 1.0f, 0.0f);

        attributes.transform3D = rotationAndPerspectiveTransform;
    }
}

return array;
}

我没有为您编辑此代码,并且有对宏和实例变量的引用,因此您需要对其进行调整以执行您想要的操作。这用于创建封面流样式布局,但原则对您来说是相同的,但没有 3D 业务。您需要设置部分 inset 以保证流程中的单行或单列。

于 2013-03-12T15:16:56.997 回答