Detailed explanation of iOS Core Animation (4) Animation in AutoLayout_html/css_WEB-ITnose

Foreword: AutoLayout defines the position of the View. That is to say, in the Auto Layout project, if the constraints themselves are not modified, when the view is redrawn, it will return to the original position. . Animation in AutoLayout is related to the position and size of the view.

Let’s take a look at the effect first

Implementation process

Drag a UIImageview on the Storyboard. Set the constraints to: Horizontal and vertical center, fixed size 100＊100

Drag the Imageview and Constraint to Outlet

Pay attention to the constraints related to dragging Y, which is this

Corresponding code

 @IBOutlet weak var imageview: UIImageView! @IBOutlet weak var yConstraints: NSLayoutConstraint!

Set the initial state of imageview in viewDidload

 yConstraints.constant = yConstraints.constant - CGRectGetHeight(UIScreen.mainScreen().bounds)/2 self.imageview.alpha = 0.0; self.imageview.transform = CGAffineTransformMakeScale(0.1, 0.1) self.view.layoutIfNeeded();

Create animation in ViewWillAppear

 yConstraints.constant = yConstraints.constant + CGRectGetHeight(UIScreen.mainScreen().bounds)/2 UIView.animateWithDuration(1.0, animations: { () -> Void in        self.imageview.alpha = 1.0        self.imageview.transform = CGAffineTransformIdentity        self.view.layoutIfNeeded() })

Principle

The principle is relatively simple, that is, modify the attribute constant in the constraint NSLayoutConstraint, and then call layoutIfNeeded to implement animation. Note that the property multiplier is currently (iOS 8.4) still read-only and cannot be modified. But it can be converted through the relationship view1.property = view2.property * multiplier constant.

AutoLayout animation with pure code

The above animation is implemented with pure code

class ViewController: UIViewController {    var imageview:UIImageView?    weak var yConstraint:NSLayoutConstraint?    override func viewDidLoad() {        super.viewDidLoad()        //添加Imageview        let image = UIImage(named: "1_hello_hwc.jpg")        imageview = UIImageView(image: image)        self.imageview?.setTranslatesAutoresizingMaskIntoConstraints(false)        self.view.addSubview(self.imageview!)        //创建约束，定义最开始的位置        let hC = NSLayoutConstraint(item:self.view, attribute:NSLayoutAttribute.CenterX, relatedBy: NSLayoutRelation.Equal, toItem: self.imageview, attribute: NSLayoutAttribute.CenterX, multiplier: 1.0, constant: 0.0)        let vC = NSLayoutConstraint(item:self.view, attribute:NSLayoutAttribute.CenterY, relatedBy: NSLayoutRelation.Equal, toItem: self.imageview, attribute: NSLayoutAttribute.CenterY, multiplier: 1.0, constant: 0.0)        yConstraint = vC;        yConstraint!.constant = yConstraint!.constant - CGRectGetHeight(UIScreen.mainScreen().bounds)/2        let widthC = NSLayoutConstraint(item:self.imageview!, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem:nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1.0, constant: 100)        let widthH = NSLayoutConstraint(item:self.imageview!, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem:nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1.0, constant: 100)        self.view.addConstraints([hC,vC,widthC,widthH])        //定义最开始的状态        self.imageview?.alpha = 0.0;        self.imageview?.transform = CGAffineTransformMakeScale(0.1, 0.1);        self.view.layoutIfNeeded()    }    override func viewWillAppear(animated: Bool) {        yConstraint!.constant = yConstraint!.constant + CGRectGetHeight(UIScreen.mainScreen().bounds)/2        UIView.animateWithDuration(1.0, animations: { () -> Void in            self.imageview!.alpha = 1.0            self.imageview!.transform = CGAffineTransformIdentity            self.view.layoutIfNeeded()        })    }}

Positioning Constraints

Set attribute identifier

yConstraint.identifier ＝ "identifier"

Then filter and define this Constraints,

 let constraint =  filter(self.view.constraints() as! [NSLayoutConstraint], { (constraint:NSLayoutConstraint) -> Bool in return constraint.identifier == "identifier" }).first