以编程方式向UIView添加约束

时间:2017-08-04 04:00:32

标签: ios iphone swift xcode uiview

我没有用编程方式做过很多UI,但我有一个UIView,我希望UILabel被约束到UIView的左上角,然后又有另一个但这次约束到右上角。我完全知道如何在GUI上执行此操作,但我想知道如何通过swift /编程方式完成此操作。

3 个答案:

答案 0 :(得分:1)

这是通过NSLayoutConstraint类完成的。

首先,将您的标签添加为子视图:

let label = UILabel()   
label.translatesAutoresizingMaskIntoConstraints = false

view.addSubview(label)

这是我的扩展程序,以便轻松地向子视图添加约束。您要学习的主要方法是func pin(firstSubview subview1:UIView, firstEdge edge1:NSLayoutAttribute, secondSubview subview2:UIView, secondEdge edge2:NSLayoutAttribute, with constant:Float)

     extension UIView {
          func pinSubview(_ subview:UIView, toEdge edge:NSLayoutAttribute, withConstant constant:Float) {
            self.pinSubviews(self, subview2: subview, toEdge: edge, withConstant: constant)
          }

          func pinSubviews(_ subview1:UIView, subview2:UIView, toEdge edge:NSLayoutAttribute, withConstant constant:Float) {
            pin(firstSubview: subview1, firstEdge: edge, secondSubview: subview2, secondEdge: edge, with: constant)
          }

          func pin(firstSubview subview1:UIView, firstEdge edge1:NSLayoutAttribute, secondSubview subview2:UIView, secondEdge edge2:NSLayoutAttribute, with constant:Float) {
            let constraint = NSLayoutConstraint(item: subview1, attribute: edge1, relatedBy: .equal, toItem: subview2, attribute: edge2, multiplier: 1, constant: CGFloat(constant))
            self.addConstraint(constraint)
          }

          func pinSubview(_ subview:UIView, withHeight height:CGFloat) {
            let height = NSLayoutConstraint(item: subview, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: height)
            self.addConstraint(height)
          }

          func pinSubview(_ subview:UIView, withWidth width:CGFloat) {
            let width = NSLayoutConstraint(item: subview, attribute: .width, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1, constant: width)
            self.addConstraint(width)
          }        
    }

然后你有非常简单的用法:

self.view.pinSubview(label, toEdge: .left, withConstant: 0)
self.view.pinSubview(label, toEdge: .top, withConstant: 0)

答案 1 :(得分:0)

查看以下代码,以便在视图中以编程方式添加约束

let containerView = UIView()
        containerView.translatesAutoresizingMaskIntoConstraints = false

        view.addSubview(containerView)

        //ios9 constraint anchors
        //x,y,w,h
        containerView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
        containerView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true
        containerView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true
        containerView.heightAnchor.constraint(equalToConstant: 50).isActive = true

        let sendButton = UIButton(type: .system)
        sendButton.setTitle("Send", for: UIControlState())
        sendButton.translatesAutoresizingMaskIntoConstraints = false
        sendButton.addTarget(self, action: #selector(handleSend), for: .touchUpInside)
        containerView.addSubview(sendButton)
        //x,y,w,h
        sendButton.rightAnchor.constraint(equalTo: containerView.rightAnchor).isActive = true
        sendButton.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
        sendButton.widthAnchor.constraint(equalToConstant: 80).isActive = true
        sendButton.heightAnchor.constraint(equalTo: containerView.heightAnchor).isActive = true

        containerView.addSubview(inputTextField)
        //x,y,w,h
        inputTextField.leftAnchor.constraint(equalTo: containerView.leftAnchor, constant: 8).isActive = true
        inputTextField.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
        inputTextField.rightAnchor.constraint(equalTo: sendButton.leftAnchor).isActive = true
        inputTextField.heightAnchor.constraint(equalTo: containerView.heightAnchor).isActive = true

答案 2 :(得分:0)

  

这是以编程方式将约束添加到UIView()

的一种方法
 override func viewDidLoad() {
            super.viewDidLoad()

let centerView = UIView()
        centerView.translatesAutoresizingMaskIntoConstraints = false
        centerView.backgroundColor = UIColor.brown
        view.addSubview(centerView)

        let centerViewhorizontalConstraint = NSLayoutConstraint(item: centerView, attribute: NSLayoutAttribute.centerX, relatedBy: NSLayoutRelation.equal, toItem: view, attribute: NSLayoutAttribute.centerX, multiplier: 1, constant: 0)

        let centerViewverticalConstraint = NSLayoutConstraint(item: centerView, attribute: NSLayoutAttribute.centerY, relatedBy: NSLayoutRelation.equal, toItem: view, attribute: NSLayoutAttribute.centerY, multiplier: 0.90, constant: 0)

        let centerViewwidthConstraint = NSLayoutConstraint(item: centerView, attribute: NSLayoutAttribute.width, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant: 300)

        let centerViewheightConstraint = NSLayoutConstraint(item: centerView, attribute: NSLayoutAttribute.height, relatedBy: NSLayoutRelation.equal, toItem: nil, attribute: NSLayoutAttribute.notAnAttribute, multiplier: 1, constant:300)

        NSLayoutConstraint.activate([centerViewhorizontalConstraint, centerViewverticalConstraint, centerViewwidthConstraint, centerViewheightConstraint])

}

enter image description here