时间戳

首页 > 解决方案 > 有没有一种更有效的方法可以在不手动指定每个视图的情况下向 UICollectionViewCell 添加相同的视图？

ios - 有没有一种更有效的方法可以在不手动指定每个视图的情况下向 UICollectionViewCell 添加相同的视图？

问题描述

class ListCell: UICollectionViewCell {

let snapshotTitle: UILabel = {
    let label = UILabel()
    label.attributes(text: "Title", textColor: .white, alignment: .left, font: Fonts.rubikMedium, size: 15, characterSpacing: -0.05, backgroundColor: nil)
    return label
}()

let snapshotOne: UILabel = {
    let label = UILabel()
    label.attributes(text: "Item 1", textColor: Colors.appDarkGrey, alignment: .left, font: Fonts.rubikRegular, size: 12, characterSpacing: -0.04, backgroundColor: nil)
    return label
}()

let snapshotTwo: UILabel = {
    let label = UILabel()
    label.attributes(text: "Item 2", textColor: Colors.appDarkGrey, alignment: .left, font: Fonts.rubikRegular, size: 12, characterSpacing: -0.04, backgroundColor: nil)
    return label
}()

let snapshotThree: UILabel = {
    let label = UILabel()
    label.attributes(text: "Item 3", textColor: Colors.appDarkGrey, alignment: .left, font: Fonts.rubikRegular, size: 12, characterSpacing: -0.04, backgroundColor: nil)
    return label
}()

let snapshotFour: UILabel = {
    let label = UILabel()
    label.attributes(text: "Item 4", textColor: Colors.appDarkGrey, alignment: .left, font: Fonts.rubikRegular, size: 12, characterSpacing: -0.04, backgroundColor: nil)
    return label
}()

let snapshotContainer: UIView = {
    let view = UIView()
    view.backgroundColor = .white
    view.layer.cornerRadius = 12
    return view
}()

let snapshotGradientBackground: UIImageView = {
    let imageView = UIImageView()
    imageView.image = #imageLiteral(resourceName: "itemCellBackgroundPink")
    imageView.contentMode = .scaleAspectFill
    imageView.layer.cornerRadius = 12
    imageView.clipsToBounds = true
    return imageView
}()

override init(frame: CGRect) {
    super.init(frame: frame)

    contentView.addSubview(snapshotGradientBackground)
    snapshotGradientBackground.setAnchors(top: contentView.topAnchor, paddingTop: 0, bottom: contentView.bottomAnchor, paddingBottom: 0, left: contentView.leftAnchor, paddingLeft: 0, right: contentView.rightAnchor, paddingRight: 0, width: 0, height: 0)

    contentView.addSubview(snapshotContainer)
    snapshotContainer.setAnchors(top: contentView.topAnchor, paddingTop: 45, bottom: contentView.bottomAnchor, paddingBottom: 0, left: contentView.leftAnchor, paddingLeft: 0, right: contentView.rightAnchor, paddingRight: 0, width: 0, height: 0)

    contentView.addSubview(snapshotTitle)
    snapshotTitle.setAnchors(top: contentView.topAnchor, paddingTop: 0, bottom: snapshotContainer.topAnchor, paddingBottom: 0, left: contentView.leftAnchor, paddingLeft: 12, right: contentView.rightAnchor, paddingRight: 12, width: 0, height: 0)

    contentView.addSubview(snapshotOne)
    snapshotOne.setAnchors(top: snapshotContainer.topAnchor, paddingTop: 18, bottom: nil, paddingBottom: 0, left: snapshotContainer.leftAnchor, paddingLeft: 12, right: snapshotContainer.rightAnchor, paddingRight: 12, width: 0, height: 14)

    contentView.addSubview(snapshotTwo)
    snapshotTwo.setAnchors(top: snapshotOne.bottomAnchor, paddingTop: 14, bottom: nil, paddingBottom: 0, left: snapshotContainer.leftAnchor, paddingLeft: 12, right: snapshotContainer.rightAnchor, paddingRight: 12, width: 0, height: 14)

    contentView.addSubview(snapshotThree)
    snapshotThree.setAnchors(top: snapshotTwo.bottomAnchor, paddingTop: 14, bottom: nil, paddingBottom: 0, left: snapshotContainer.leftAnchor, paddingLeft: 12, right: snapshotContainer.rightAnchor, paddingRight: 12, width: 0, height: 14)

    contentView.addSubview(snapshotFour)
    snapshotFour.setAnchors(top: snapshotThree.bottomAnchor, paddingTop: 14, bottom: nil, paddingBottom: 0, left: snapshotContainer.leftAnchor, paddingLeft: 12, right: snapshotContainer.rightAnchor, paddingRight: 12, width: 0, height: 14)

}

required init?(coder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
    }
}

我将如何遍历项目列表并将标签设置为该项目，而不是手动添加每个标签（snapshotOne、snapshotTwo、snapshotThree、snapshotFour）？目前，我只是为每个项目创建单独的闭包，然后将它们一个一个添加。如果有帮助，我想显示的最大项目数量是四个（项目列表中的前四个项目）。

这是一张图片，展示了当前代码的作用：

图片

这是我的一个大问题，非常感谢任何帮助。我对 Swift 编程相当陌生，所以如果你看到任何其他问题，请随时指出我的代码中的任何其他问题。谢谢！

标签： iosswiftuicollectionviewuicollectionviewcell

解决方案

对于 4 个快照标签，您可以将它们放在一个数组中：

let snapshotLabels = (1...4).map { number in
    let label = UILabel()
    label.attributes(text: "Item \(number)", // note the use of "number" here 
                    textColor: Colors.appDarkGrey, 
                    alignment: .left, 
                    font: Fonts.rubikRegular, 
                    size: 12, 
                    characterSpacing: -0.04, 
                    backgroundColor: nil)
    return label
}

对于布局，您可以使用 aUIStackView或 a UITableView，具体取决于您希望它在项目数少于 4 时的外观。

，UIStackView你可以做

let stackView = UIStackView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))
stackView.setAnchors(...)
stackView.axis = .vertical
stackView.alignment = .leading
stackView.distribution = .fillEqually
for label in snapshotLabels {
    stackView.addArrangedSubview(label)
}

推荐阅读