如何在 UICollectionView Swift 4.0 中正确调整大小和居中扩展单元格

Posted 2023-03-14

【中文标题】如何在 UICollectionView Swift 4.0 中正确调整大小和居中扩展单元格

【英文标题】：How to properly size and center expanding cells in UICollectionView Swift 4.0

【发布时间】：2018-02-28 20:15:08

【问题描述】：

请注意，我已经在互联网上搜索过，但没有找到一个既可以调整大小又可以使单元格居中的地方。我自己尝试过，但我一直在遇到无法避免的错误。我是斯威夫特的新手。我的代码：

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath:IndexPath) -> CGSize 
        let cellWidth = collectionView.frame.size.width / 7.0
        let cellHeight = collectionView.frame.height - 4.0
        let imageSideLength = cellWidth < cellHeight ? cellWidth : cellHeight
        return CGSize(width: imageSideLength, height: imageSideLength)
    

    //centers the cells
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets 
        // Make sure that the number of items is worth the computing effort.
        guard let flowLayout = collectionViewLayout as? UICollectionViewFlowLayout,
            let dataSourceCount = photoCollectionView.dataSource?.collectionView(photoCollectionView, numberOfItemsInSection: section),
            dataSourceCount > 0 else 
                return .zero
        

        let cellCount = CGFloat(dataSourceCount)
        let itemSpacing = flowLayout.minimumInteritemSpacing
        let cellWidth = flowLayout.itemSize.width + itemSpacing
        let cellHeight = flowLayout.itemSize.height
        var insets = flowLayout.sectionInset

        // Make sure to remove the last item spacing or it will
        // miscalculate the actual total width.
        let totalCellWidth = (cellWidth * cellCount) - itemSpacing
        let contentWidth = collectionView.frame.size.width - collectionView.contentInset.left - collectionView.contentInset.right
        let contentHeight = collectionView.frame.size.height

        // If the number of cells that exist take up less room than the
        // collection view width, then center the content with the appropriate insets.
        // Otherwise return the default layout inset.
        guard totalCellWidth < contentWidth else 
            return insets
        

        // Calculate the right amount of padding to center the cells.
        let padding = (contentWidth - totalCellWidth) / 2.0
        insets.left = padding
        insets.right = padding
        insets.top = (contentHeight - cellHeight) / 2.0
        //insets.bottom = (contentHeight - cellHeight) / 2.0
        return insets
    

我尝试使用两个单独的函数：第一个调整单元格的大小，第二个调整单元格的中心。 （注意我只希望新单元格水平扩展，最多 6 个单元格。）但是，我在第二个函数中计算的单元格高度和宽度与我在第一个函数中的设置方式不一致，引发了一系列问题。任何有关如何调整单元格大小和居中位置的见解，以便我可以在屏幕居中水平放置 1-6 个单元格。

【参考方案1】：

您的布局调用有冲突。试试关注THIS Tutorial to get the hang of it.

否则，一个很好的答案是HERE

var flowLayout: UICollectionViewFlowLayout 
    let _flowLayout = UICollectionViewFlowLayout()

    // edit properties here
    _flowLayout.itemSize = CGSize(width: 98, height: 134)
    _flowLayout.sectionInset = UIEdgeInsetsMake(0, 5, 0, 5)
    _flowLayout.scrollDirection = UICollectionViewScrollDirection.horizontal
    _flowLayout.minimumInteritemSpacing = 0.0
    // edit properties here

    return _flowLayout

设置：

self.collectionView.collectionViewLayout = flowLayout // after initializing it another way
// or
UICollectionView(frame: .zero, collectionViewLayout: flowLayout)

【讨论】：

非常感谢您的回复。我实际上并不希望允许水平滚动。我希望所有单元格都放在同一个屏幕上，居中。

这是更多关于如何正确使用flowLayout 的示例，您可以按照自己的方式自定义

我在哪里称呼这个？调用它会设置单元格大小吗？

您可以在viewDidLoad() 中调用它，是的，您想用您想要的值替换width、height 和minimumInteritemSpacing。

所以这与：func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath:IndexPath) -> CGSize 的作用相同？