在UITableView

时间:2017-01-03 09:00:43

标签: ios swift uitableview uistackview

我有UITableView需要通过列出类似

的样式来支持内容

enter image description here

但棘手的部分是“标签”的数量会随每个单元格而变化,有些可能只有4个,但最多12个。此外,“值”可以是单个单词,也可以是短语,最多两行(如上图所示)。因此,我决定使用UIStackView帮助我打包并调整用于显示此内容的UILabels。当“标签”的长度变化如下时,我目前遇到了问题: enter image description here

即使“标签”的长度不同,我也需要将“值”的前端与第一张图像对齐。是否存在允许UIStackView的行为?或者是否有另一种方法可以让我获得我需要的结果?

注意:每个“标签”和“值”都在一个UIStackView中,我这样做是为了对齐它们。

我也尝试使用字符串格式,但是带有多行的“Values”将包装在标签下,而不是像我设法在图像中那样自行包装。

我尝试将所有“标签”放在一个UIStackView中,将所有“值”放在另一个中,一旦“值”超过一行,我就无法像在图像中那样对齐它们。 / p>

或者如果我在某个地方犯了错误,这就是我创建UIStackViews的方式:

    var higherCount = 0
    if labels.count<values.count {
        higherCount = values.count
    } else {
        higherCount = labels.count
    }

    mainStackView = UIStackView(frame: CGRect(x: 0, y: 0, width: frame.width, height: frame.height))

    for i in 0..<higherCount {
        var height:CGFloat = 20
        if (values[i] as NSString).size(attributes: [NSFontAttributeName:UIFont.systemFont(ofSize: UIFont.systemFontSize)]).width > frame.width {
            height = 42
        }

        let stackViewToAdd = UIStackView(frame: CGRect(x: 0, y: 0, width: frame.width, height: height))

        let label = UILabel(frame: CGRect(x: 0, y: 0, width: frame.width, height: height))
        if labels.count<higherCount {
            label.text = ""
        } else {
            label.text = labels[i]
        }
        label.setContentCompressionResistancePriority(1000, for: .horizontal)
        label.setContentHuggingPriority(999, for: .horizontal)
        stackViewToAdd.addArrangedSubview(label)
        let value = UILabel(frame: CGRect(x: 0, y: 0, width: frame.width, height: height))
        if values.count<higherCount {
            value.text = ""
        } else {
            value.text = values[i]
        }
        value.lineBreakMode = .byWordWrapping
        value.numberOfLines = 2
        stackViewToAdd.addArrangedSubview(value)
        mainStackView?.addArrangedSubview(stackViewToAdd)
    }
    mainStackView?.alignment = .fill
    mainStackView?.axis = .vertical
    mainStackView?.distribution = .fill

1 个答案:

答案 0 :(得分:1)

我以编程方式创建了您的单元格,然后您可以通过编程方式调整单元格大小取决于UILabel内容的大小。

在我的情况下,Label字体为UIFont.systemFont(ofSize: 15),最小TableViewCell高度为50,arrLabel1arrLabel2将是标签的内容。

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return arrLable1.count
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = UITableViewCell(style: .default, reuseIdentifier: "\(indexPath.row)")

    let lable1 = UILabel(frame: CGRect(x: 10, y: 10, width: view.frame.size.width - 20, height: 0))
    lable1.numberOfLines = 0
    lable1.font = UIFont.systemFont(ofSize: 15)
    lable1.text = arrLable1[indexPath.row]
    lable1.sizeToFit()
    cell.addSubview(lable1)

    let lable2 = UILabel(frame: CGRect(x: 10, y: lable1.frame.origin.y + lable1.frame.size.height + 10 , width: view.frame.size.width - 20, height: 0))
    lable2.numberOfLines = 0
    lable2.font = UIFont.systemFont(ofSize: 15)
    lable2.text = arrLable2[indexPath.row]
    lable2.sizeToFit()
    cell.addSubview(lable2)

    return cell
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath)
    -> CGFloat {

    let boundingRect1 = arrLable1[indexPath.row].boundingRect(with: CGSize(width: view.frame.size.width - 40 , height: CGFloat(MAXFLOAT)), options: NSStringDrawingOptions.usesLineFragmentOrigin,attributes:[ NSFontAttributeName : UIFont.systemFont(ofSize: 15)] ,context: nil)

    let boundingRect2 = arrLable2[indexPath.row].boundingRect(with: CGSize(width: view.frame.size.width - 40 , height: CGFloat(MAXFLOAT)), options: NSStringDrawingOptions.usesLineFragmentOrigin,attributes:[ NSFontAttributeName : UIFont.systemFont(ofSize: 15)] ,context: nil)

    guard boundingRect1.height + boundingRect2.height + 30 > 50 else {
        return 50
    }

    return boundingRect1.height + boundingRect2.height + 30
}
  
    

Label numberOfLines设为0