2017-08-04 124 views
2

我沒有做很多的UI編程,但我有一個UIView,我想UILabel被約束到UIView的左上角,然後有另一個約束到右上角這次。我完全意識到如何在GUI上做到這一點,但我想知道如何純粹通過swift/programatically來實現這一點。多謝你們。以編程方式將約束添加到UIView

+2

[NSLayoutConstraint](https://developer.apple.com/documentation/appkit/nslayoutconstraint)和[自動佈局指南(https://developer.apple.com/圖書館/內容/文檔/用戶體驗/概念/ AutolayoutPG /以編程方式創建Constraints.html)是你的朋友。 – paulvs

回答

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) 
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 
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

相關問題