swift UICollectionView单元格布局问题

yftpprvb  于 2023-06-21  发布在  Swift
关注(0)|答案(1)|浏览(128)

我正在处理一个UICollectionView,它包含带有图像和标签的单元格。我创建了一个三列流程布局。
然而,我遇到了一个问题,细胞似乎是巨大的,不成比例。当我使用视图调试器检查应用程序时,我发现图像视图的约束似乎是导致问题的原因。图像视图的大小将超过单元格大小,并与其他单元格重叠。
下面是我的集合视图设置和单元格布局的相关代码,以及到我的项目https://github.com/lexypaul13/Trending-Tv-Shows.git的链接

// In the WeeklyViewController
func createThreeColumnFlowLayout() -> UICollectionViewFlowLayout {
    let width = view.bounds.width
    let padding: CGFloat = 12
    let minimumItemSpacing: CGFloat = 10
    let availableWidth = width - (padding * 2) - (minimumItemSpacing * 2)
    let itemWidth = availableWidth / 3

    let itemHeight = itemWidth * 1.3 // 1.3 is the aspect ratio, adjust based on your need

    let flowLayout = UICollectionViewFlowLayout()
    flowLayout.sectionInset = UIEdgeInsets(top: padding, left: padding, bottom: padding, right: padding)
    flowLayout.itemSize = CGSize(width: itemWidth, height: itemHeight)

    return flowLayout
}

// In the TvCellCollectionViewCell 
private func set() {
    addSubview(tvImage)
    addSubview(tvName)
    
    tvImage.translatesAutoresizingMaskIntoConstraints = false
    tvName.translatesAutoresizingMaskIntoConstraints = false
    let padding : CGFloat = 8
    
    NSLayoutConstraint.activate([
        tvImage.topAnchor.constraint(equalTo: contentView.topAnchor, constant: padding),
        tvImage.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: padding),
        tvImage.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -padding),
        tvImage.heightAnchor.constraint(equalTo: tvImage.widthAnchor),
        tvName.topAnchor.constraint(equalTo: tvImage.bottomAnchor, constant: 12),
        tvName.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: padding),
        tvName.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -padding),
    ])
}

//在单元格private func set(){ addSubview(tvImage)addSubview(tvName)

tvImage.translatesAutoresizingMaskIntoConstraints = false
tvName.translatesAutoresizingMaskIntoConstraints = false
let padding : CGFloat = 8

NSLayoutConstraint.activate([
    tvImage.topAnchor.constraint(equalTo: contentView.topAnchor, constant: padding),
    tvImage.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: padding),
    tvImage.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -padding),
    tvImage.heightAnchor.constraint(equalTo: tvImage.widthAnchor),
    tvName.topAnchor.constraint(equalTo: tvImage.bottomAnchor, constant: 12),
    tvName.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: padding),
    tvName.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -padding),
])

}

edqdpe6u

edqdpe6u1#

TvCellCollectionViewCell类中,您有:

private func set() {
    addSubview(tvImage)
    addSubview(tvName)
    // ...

您需要将子视图添加到单元格的contentView

private func set() {
    contentView.addSubview(tvImage)
    contentView.addSubview(tvName)

相关问题