在 Swift 中以编程方式添加自动布局约束将 uiview 变为黑色

Question

我有一个名为 DropDownList 的 UIView 类，它包含一个标签和一个按钮。此标签和按钮放置在堆栈视图中。以下是我添加到此视图的约束。问题是当添加此约束时，整个视图（主视图）在设备中变为黑色，但在模拟器中有效。当更改按钮标题时，我还面临另一个问题，整个视图（主视图）在模拟器中变黑。我正在使用 swift 4 和 Xcode 9.0。请帮忙...

class DropDownList: UIView {

    let DefaultSpace: CGFloat = 50.0
    let Margin: CGFloat = 10.0
    let StackViewSpacing: CGFloat  = 50.0

    var mDataList:[Dictionary<String,Any>] = [] {

    }
    var mFieldLabel: UILabel =
    {
        let fieldLabel = UILabel()
        fieldLabel.font = AppFont
        fieldLabel.textAlignment = .left
        return fieldLabel
    }()

    var mDropDown: DropDown = DropDown()
    var mDropDownBtn: UIButton = {
        let btn = UIButton()
        btn.setTitle("-Select-", for: .normal)
        btn.setTitleColor(.black, for: .normal)
        btn.titleLabel?.textAlignment = .left
        btn.titleLabel?.font = AppFont
        btn.addTarget(self, action:#selector(dropDownClick) , for: .touchUpInside)
        return btn

    }()

    lazy  var mStackView: UIStackView = {

        let stackView = UIStackView(arrangedSubviews: [mFieldLabel, mDropDownBtn])
        stackView.alignment = .center
        stackView.distribution = .fill
        stackView.axis = .horizontal
        stackView.spacing = StackViewSpacing
        stackView.translatesAutoresizingMaskIntoConstraints = false
        stackView.backgroundColor = .yellow
        return stackView
    }()

    override func awakeFromNib() {
        super.awakeFromNib()

    }

    // MARK: - Init



    init(with data:[Dictionary<String,Any>], inView: UIView, parent: DropDownList?, fieldName: String , topSpacing: CGFloat )
    {
        super.init(frame: CGRect(x: 0, y: 40, width: 400, height: 50))
        setViews(fieldName: fieldName, data: data, inView: inView)
        self.setConstaintsWithTopSpacing(inView: inView,topSpace: topSpacing, parentView: inView)



    func setViews(fieldName: String, data:[Dictionary<String,Any>], inView: UIView)
    {
        self.translatesAutoresizingMaskIntoConstraints = false
        self.mDataList = data
        self.mFieldLabel.text = fieldName
        DropDown.startListeningToKeyboard()
        mDropDown.anchorView = mDropDownBtn
        self.addSubview(mStackView)
        inView.addSubview(self)

 mDropDown.selectionAction = { [unowned self] (index: Int, item: String) in
            print("Selected item: \(item) at index: \(index)")
            self.mDropDownBtn.setTitle(item, for: .normal)
            self.updateConstraints()
            self.layoutIfNeeded()
        }

    }





    // MARK: - Constraints

    func setConstaintsWithTopSpacing(inView: UIView, topSpace: CGFloat, parentView: UIView)
    {
        if (inView.translatesAutoresizingMaskIntoConstraints)
        {
            inView.translatesAutoresizingMaskIntoConstraints = false
        }


        let leadingConstraint = NSLayoutConstraint(item: self, attribute: .leading, relatedBy: NSLayoutRelation.equal, toItem: inView, attribute: .leading, multiplier: 1, constant: Margin)
        let topConstraint = NSLayoutConstraint(item: self, attribute: .top, relatedBy: NSLayoutRelation.equal, toItem: parentView, attribute: .top, multiplier: 1, constant: topSpace)
        let trailingConstraint = NSLayoutConstraint(item: self, attribute: .trailing, relatedBy: NSLayoutRelation.equal, toItem: inView, attribute: .trailing, multiplier: 1, constant: Margin)
        let heightConstranit = NSLayoutConstraint(item: self, attribute: .height, relatedBy: .greaterThanOrEqual, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: 40)



        inView.addConstraints([leadingConstraint, topConstraint, trailingConstraint, heightConstranit])
        setStackViewConstraints()
    }

    func setConstaintsWithTopLayout(inView: UIView, topLayout: UILayoutSupport?)
    {
        if (inView.translatesAutoresizingMaskIntoConstraints)
        {
            inView.translatesAutoresizingMaskIntoConstraints = false
        }

        setStackViewConstraints()


        let leadingConstraint = NSLayoutConstraint(item: self, attribute: .leading, relatedBy: NSLayoutRelation.equal, toItem: inView, attribute: .leading, multiplier: 1, constant: 10)
        let topConstraint = NSLayoutConstraint(item: self, attribute: .top, relatedBy: NSLayoutRelation.equal, toItem: inView, attribute: .top, multiplier: 1, constant: 80)
        let trailingConstraint = NSLayoutConstraint(item: self, attribute: .trailing, relatedBy: NSLayoutRelation.equal, toItem: inView, attribute: .trailing, multiplier: 1, constant: 10)

        inView.addConstraints([leadingConstraint, topConstraint, trailingConstraint])





    }

    func  setStackViewConstraints()
    {



        let leadingConstraintStackView = NSLayoutConstraint(item: mStackView, attribute: .leading, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: .leading, multiplier: 1, constant: 0)
        let topConstraintStackView = NSLayoutConstraint(item: mStackView, attribute: .top, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: .top, multiplier: 1, constant: 0)
        let trailingConstraintStackView = NSLayoutConstraint(item: mStackView, attribute: .trailing, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: .trailing, multiplier: 1, constant: 0)
        let bottomConstraintStackView = NSLayoutConstraint(item: mStackView, attribute: .bottom, relatedBy: NSLayoutRelation.equal, toItem: self, attribute: .bottom, multiplier: 1, constant: 0)

        self.addConstraints([leadingConstraintStackView, topConstraintStackView, trailingConstraintStackView, bottomConstraintStackView])
    }


}

我正在创建这个类的对象并将子视图创建到 mainView。

let sailsOfficeDl = DropDownList(with: [dic, dic1], inView: self.view, fieldName: "Sales Office", topLayout: self.topLayoutGuide)

Answer 1

我之前在创建 UIView 的子类时注意到了相同的行为

我们在初始化类时明确需要将背景颜色设置为清除

init(frame:CGRect,distance:CGFloat,width:CGFloat)
    {
        super.init(frame: frame)
        /// Here I need to set the BackGround color as Clear
        /// If I comment this line Output shown is output 1
        /// if I dont comment this Line Output is shown in output 2
        self.backgroundColor = UIColor.clear
        self.isUserInteractionEnabled = true
        self.distance = distance
        self.textBgColor = UIColor.red
        self.labelText = "Sample"
        self.bgColor = UIColor.black
        self.viewWidth = width
        self.textFontSize = 14
        self.frame = CGRect(x: 0, y: 0, width: (distance*2)+width, height: (distance*2)+width)
    }

输出 1

输出 2

在 output-1 中，我的整个矩形变成黑色 在输出 2 中，只有我绘制的上下文是黑色，因为我将其设置为黑色

希望对您有所帮助