iOS9.0 NSLayoutAnchor初探

NSLayoutAnchor APIiOS9版本引入,不只讓約束聲明更加清晰明瞭,並且還經過靜態類型檢查以確保約束可以正常工做,swift

實際上是一個工廠類,相似NSNumber這樣的設計思想.app

NSLayoutAnchor用來建立NSLayoutConstraint對象,使用這些對象從而實現自動佈局.ide

可是通常不會直接建立NSLayoutConstraint對象,而是用UIView(NSView)或者其子類,或者UILayoutGuide的某個anchor屬性(好比centerXAnchor),佈局

這些屬性對應Auto Layout中主要的NSLayoutAttribute(InterfaceBuilder下屬性欄能夠看到),因此也能夠用NSLayoutAnchor子類建立這些NSLayoutAttribute.動畫

   我的使用以後,感受就是語法更加易於理解和使用了,Masonry語法同樣親切.ui

    主意:UIView自己並無提供anchor屬性對應Auto Layoutmargin屬性,可是UILayoutGuide有這樣的屬性與之對應.spa

 

1.使用NSLayoutConstraint建立設計

constraints,實現一個100*100大小,左邊和superView相距20,頂部相距100的View對象

2.使用LayoutAnchor實現相似的約束blog

對比能夠看到NSLayoutAnchor類提供了更有優點的NSLayoutConstaint API

        :1.更加整潔,優雅,易讀

        2.經過NSLayoutAnchor中的方法來約束錨點參數以及做爲接收器的相同泛型類型(NSLayoutAttribute)API 便可以使用類型檢查以確保可以建立出有效的約束

        主意:儘管NSLayoutAnchor類會進行類型檢測,但然不能必定確保建立的約束是有效的.好比一個ViewleadingAnchor和另一個ViewleftAnchor,進行約束,儘管都是NSLayoutXAnchor的實例,編譯也能經過,可是,Auto Layout不容許leadingtrailling的屬性和left或者right混和約束.會致使在運行時崩潰的結果.

        Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '*** +[NSLayoutConstraint constraintWithItem:attribute:relatedBy:toItem:attribute:multiplier:constant:]: A constraint cannot be made between a leading/trailing attribute and a right/left attribute. Use leading/trailing for both or neither.'

        *** First throw call stack:

        */

實現的效果

 

3.NSLayoutAnchor的練習

實現2view大小同樣,和屏幕距離爲20,

let yellowView = UIView()
        yellowView.backgroundColor = UIColor.yellowColor()
        yellowView.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(yellowView)
        
        let blueView = UIView()
        blueView.backgroundColor = UIColor.blueColor()
        blueView.translatesAutoresizingMaskIntoConstraints = false
        view.addSubview(blueView)
        
        //LayoutAnchor約束
let yLeftCon = yellowView.leftAnchor.constraintEqualToAnchor(view.leftAnchor, constant: 20) let ytopCon = yellowView.topAnchor.constraintEqualToAnchor(view.topAnchor, constant: 250) let yHeightCon = yellowView.heightAnchor.constraintEqualToConstant(150) let yWidthCon = yellowView.widthAnchor.constraintEqualToAnchor(blueView.widthAnchor) let yRightCon = yellowView.rightAnchor.constraintEqualToAnchor(blueView.leftAnchor,constant: -100) let bLeftCon = blueView.leftAnchor.constraintEqualToAnchor(yellowView.rightAnchor, constant: 100) let bTopCon = blueView.topAnchor.constraintEqualToAnchor(yellowView.topAnchor) let bRightCon = blueView.rightAnchor.constraintEqualToAnchor(view.rightAnchor, constant: -20) let bWidthCon = blueView.widthAnchor.constraintEqualToAnchor(yellowView.widthAnchor) let bHeightCon = blueView.heightAnchor.constraintEqualToAnchor(yellowView.heightAnchor) NSLayoutConstraint.activateConstraints([yLeftCon,ytopCon,yHeightCon,yWidthCon,yRightCon,bLeftCon,bTopCon,bRightCon,bWidthCon,bHeightCon])

  

最終的效果

 

4.Layout動畫的實現

 

let conX =  iconView.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor)
        conY =  iconView.centerYAnchor.constraintEqualToAnchor(view.centerYAnchor)
      let conW = iconView.widthAnchor.constraintEqualToConstant(100.0)
       let conH = iconView.heightAnchor.constraintEqualToConstant(100.0)
        
        NSLayoutConstraint.activateConstraints([conX,conY,conW,conH])


override func viewDidAppear(animated: Bool) {
        super.viewDidAppear(animated)
        UIView.animateWithDuration(1.0, delay: 2.0, usingSpringWithDamping: 0.4, initialSpringVelocity: 0.0, options: [], animations: { () -> Void in
            self.conY.constant -= 100
            self.view.layoutIfNeeded()
            }, completion: nil)

        
    }

  會看到進入界面2秒後,iconView在Y方向上有一個位移彈性動畫

關於更多的NSLayout Anchor能夠查閱文檔,更深刻了解,實現本身想要的效果

相關文章
相關標籤/搜索