如何通过自动布局设置集合视图的像元大小 [英] How do I set collection view's cell size via the auto layout

问题描述

我正在尝试通过auto layout调整单元格的大小.

Hi I'm trying to resize the cell via the auto layout.

我想按3乘3显示单元格.

I want display the cell by the 3 by 3.

第一个单元格的边距为零

First Cell's margin left=0

最后一个单元格的边距右边= 0

Last Cell's margin right=0

所有单元格空间均为1pt.就像instagram.

And all of the cell's space has 1pt. Like an instagram.

我应该设置单元格的大小吗?我想通过自动版式设置约束.

Should I set to Cell's Size? I want set constraint via the Autolayout.

我还尝试使用代码设置单元格的大小.

I also trying to set cell's size using the code.

这是我的代码:

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    return CGSizeMake(123, 123);
}

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumLineSpacingForSectionAtIndex section: Int) -> CGFloat {
    return 1;
}

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, minimumInteritemSpacingForSectionAtIndex section: Int) -> CGFloat {
    return 1;
}

但是..我认为这并不是完全计算出单元格的大小.

But..I think it is not exactly calculate the cell's size.

如何根据屏幕尺寸设置单元格的尺寸?

How do I set cell's size depending on the screen's size?

我必须在单元格之间设置1pt的间距.

I have to set space the 1pt between cell's.

有没有可以仅使用情节提要进行设置?

Is there anyway to set only using the storyboard?

如果没有，该如何设置代码?

If not, How do I set by the code?

谢谢.

推荐答案

我不相信您只能通过使用Storyboard来设置大小，因为您不能对重复项(如在其上创建的集合视图单元格)设置约束在运行时飞起来.

I don't believe you can set the size by only using the Storyboard because you can't set constraints to recurring items like collection view cells that are created on the fly at runtime.

您可以根据给出的信息轻松计算大小.在collectionView(_:layout:sizeForItemAt:)中，您可以访问collectionView的边界以计算所需的单元格大小:

You can easily compute the size from the information you are given. In collectionView(_:layout:sizeForItemAt:) you can access the bounds of the collectionView to compute the desired size of your cell:

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    // Compute the dimension of a cell for an NxN layout with space S between
    // cells.  Take the collection view's width, subtract (N-1)*S points for
    // the spaces between the cells, and then divide by N to find the final
    // dimension for the cell's width and height.

    let cellsAcross: CGFloat = 3
    let spaceBetweenCells: CGFloat = 1
    let dim = (collectionView.bounds.width - (cellsAcross - 1) * spaceBetweenCells) / cellsAcross
    return CGSize(width: dim, height: dim)
}

确保您的课程采用协议UICollectionViewDelegateFlowLayout.

Make sure your class adopts the protocol UICollectionViewDelegateFlowLayout.

然后它适用于所有尺寸的iPhone和iPad.

This then works for iPhones and iPads of all sizes.

这篇关于如何通过自动布局设置集合视图的像元大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！