最終,解決這個問題的關鍵是指定每個視圖的寬度,並使用自動佈局來標記標籤。最後,我需要計算總寬度,以便將UIStackView
的模式設置爲「分佈:等間距」,這些項目將被適當地分隔開。這是我的最終代碼:
import Foundation
import UIKit
class DataView: UIStackView {
var widthRequired = CGFloat()
func addData(_ data: String) {
let view = UIView()
let label = UILabel()
label.font = uifont_notification
view.backgroundColor = uicolor_verylight
label.textColor = uicolor_dark
label.text = data
label.textAlignment = .center
label.sizeToFit()
view.addSubview(label)
widthRequired = label.frame.width + widthRequired + 24
label.translatesAutoresizingMaskIntoConstraints = false
view.translatesAutoresizingMaskIntoConstraints = false
let labelView = ["label" : label]
let formatString = "H:|-[label]-|"
let formatStringV = "V:|-[label]-|"
let outerView = ["view" : view]
let formatStringW = "[view(==\(label.frame.width + 20))]"
let constraintH = NSLayoutConstraint.constraints(withVisualFormat: formatString, options:.alignAllCenterX , metrics: nil, views: labelView)
let constraintV = NSLayoutConstraint.constraints(withVisualFormat: formatStringV, options:.alignAllCenterX , metrics: nil, views: labelView)
let constraintW = NSLayoutConstraint.constraints(withVisualFormat: formatStringW, options:.alignAllCenterX , metrics: nil, views: outerView)
NSLayoutConstraint.activate(constraintH)
NSLayoutConstraint.activate(constraintV)
NSLayoutConstraint.activate(constraintW)
view.layer.cornerRadius = 4
self.addArrangedSubview(view)
label.setNeedsLayout()
}
}
像這樣來使用,一個collectionView cellForItemAt
功能
cell.itemData.addData("One")
cell.itemData.addData("Two")
cell.itemData.addData("Three")
cell.itemDataWidth.constant = cell.itemData.widthRequired // The width of the `UIStackView` constraint as a @IBOutlet in the custom cell
希望幫助別人之內。以下是使用時的最終圖像:
來源
2016-10-14 16:20:28
Ben