UICollectionViewCell 中的动态布局

问题描述 投票:0回答:1

我正在开发一种数据仪表板,并尝试使用 UIViewCollection,每个指示器一个单元格。在足够宽的显示器上,我想实现这样的标准单元尺寸:

但是在较小或更窄的显示器上,我想使用像这样的一列显示器:

要更改单元格尺寸(在 Swift 中),我将 UICollectionViewFlowLayout 子类化,如下所示:

class SBCollectionViewLayout : UICollectionViewFlowLayout {    
    override func prepare() {
    
        if let view = collectionView {
            let width = view.frame.width
            if width < 375 {
                self.itemSize = CGSize(width: width, height: 50)
            }
            else {
                self.itemSize = CGSize(width: 200, height: 110)
            }
        }
    }
}

因此,这可以很好地处理单元格大小调整,但我对如何根据单元格大小动态调整单元格内对象的布局感到有点困惑。例如,我想调整标签中的字体大小并将它们垂直对齐而不是相互重叠。

在类似的情况下,我在子视图(本例中为文本标签)上编写了两组编程约束,并使用 addConstraints/removeConstraints 启用了一组或另一组。在这种情况下,这是要走的路吗?如果是,我应该在哪里添加代码来调整约束?

我能想到的另一种方法是将一个 UICollectionViewCell 子类替换为另一个 UICollectionViewCell 子类,并通过调用 UICollectionView.reloadData 来触发替换,但这看起来真的很不优雅。

或者还有其他方法吗?

ios uicollectionview
1个回答
0
投票

谢谢@shivbabas-son,这是我需要的缺失的拼图。所以我在 UICollectionViewDelegate 中添加了代码以达到效果:

func collectionView(_ collectionView: UICollectionView, willDisplay cell: UICollectionViewCell, forItemAt indexPath: IndexPath) {
        
    if let c = cell as? SBCollectionViewCell1 {
        let constraints:NSLayoutConstraint = [...]
        if cell.frame.width < 375 {
            cell.contentView.addConstraints(constraints)
        }
        else {
         
   cell.contentView.removeConstraints(constraints)
        }
    }
}

多田!

更新

经过更多的实验,我发现 collectionView(collectionView:willDisplay:forItemAt) 还不够,因为在窗口大小更改后,它不会被所有单元格调用(或召回)。所以我还必须将以下内容添加到我的 UIViewController 中:

override func viewWillTransition(to size: CGSize, with coordinator: any UIViewControllerTransitionCoordinator) {
    
    coordinator.animate(alongsideTransition: nil) { _ in
        if self.display != nil {
            self.display.reloadData()
        }
    }
}
© www.soinside.com 2019 - 2024. All rights reserved.