原创blog。转载请注明出处

blog.csdn.net/hello_hwc

欢迎关注我的iOS SDK具体解释专栏

http://blog.csdn.net/column/details/huangwenchen-ios-sdk.html


前言:AutoLayout定义了View的位置,也就是说,在Auto Layout的project里,假设不改动约束本身,在视图又一次绘制的时候。还会回到最開始的位置。AutoLayout中的动画与视图的位置和大小有关。


先看看效果


实现过程

在Storyboard上拖拽一个UIImageview。设置约束为:水平垂直正中心,大小非常定100*100

拖拽Imageview以及Constraint为Outlet

注意拖拽Y相关的约束,也就是这个



相应代码

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

在viewDidload中设置imageview的初始状态

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

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

原理

原理比較简单。就是利用改动约束NSLayoutConstraint中的属性constant。然后调用layoutIfNeeded来实现动画。注意。属性multiplier眼下(iOS 8.4)还是仅仅读的,不能改动。可是能够通过关系view1.property = view2.property * multiplier + constant进行转换。


纯代码的AutoLayout动画

上述动画用纯代码实现

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

定位Constraints

设置属性identifier

yConstraint.identifier = "identifier"

然后在过滤。定义到这个Constraints,

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

iOS Core Animation具体解释(四)AutoLayout中的动画的更多相关文章

  1. iOS - Core Animation 核心动画

    1.UIView 动画 具体讲解见 iOS - UIView 动画 2.UIImageView 动画 具体讲解见 iOS - UIImageView 动画 3.CADisplayLink 定时器 具体 ...

  2. iOS Core Animation 简明系列教程

    iOS Core Animation 简明系列教程  看到无数的CA教程,都非常的难懂,各种事务各种图层关系看的人头大.自己就想用通俗的语言翻译给大家听,尽可能准确表达,如果哪里有问题,请您指出我会尽 ...

  3. 转 iOS Core Animation 动画 入门学习(一)基础

    iOS Core Animation 动画 入门学习(一)基础 reference:https://developer.apple.com/library/ios/documentation/Coco ...

  4. iOS——Core Animation 知识摘抄(四)

    原文地址http://www.cocoachina.com/ios/20150106/10840.html 延迟解压 一旦图片文件被加载就必须要进行解码,解码过程是一个相当复杂的任务,需要消耗非常长的 ...

  5. IOS Core Animation Advanced Techniques的学习笔记(四)

    第五章:Transforms   Affine Transforms   CGAffineTransform是二维的     Creating a CGAffineTransform   主要有三种变 ...

  6. iOS——Core Animation 知识摘抄(二)

    阴影 主要是shadowOpacity .shadowColor.shadowOffset和shadowRadius四个属性 shadowPath属性 我们已经知道图层阴影并不总是方的,而是从图层内容 ...

  7. IOS Core Animation Advanced Techniques的学习笔记(五)

    第六章:Specialized Layers   类别 用途 CAEmitterLayer 用于实现基于Core Animation粒子发射系统.发射器层对象控制粒子的生成和起源 CAGradient ...

  8. iOS——Core Animation 知识摘抄(三)

    原文地址:http://www.cocoachina.com/ios/20150105/10827.html CAShapeLayer CAShapeLayer是一个通过矢量图形而不是bitmap来绘 ...

  9. iOS——Core Animation 知识摘抄(一)

    本文是对http://www.cocoachina.com/ios/20150104/10814.html文章的关键段落的摘抄,有需要的看原文 CALayer和UIView的关系: CALayer类在 ...

随机推荐

  1. 再谈Ubuntu和CentOS安装好之后的联网问题(桥接和NAT、静态和动态ip)(博主推荐)

    不多说,直接上干货! 首先,普及概念. hostonly.桥接和NAT的联网方式 对于CentOS系统,用的最多的就是,NAT和桥接模式 CentOS 6.5静态IP的设置(NAT和桥接联网方式都适用 ...

  2. kindeditor 不能编辑 问题

    /*显示上传窗体*/ function ShowUplodToDaily() { var _sdata = grid.getSelecteds(); if (_sdata) { /*创建编辑器*/ v ...

  3. benchmark测试PostgreSQL数据库OLTP性能

    1,安装配置PostgreSQL数据库 2,下载地址:http://sourceforge.net/projects/benchmarksql/?source=navbar Required:JDK7 ...

  4. C#线程安全打开/保存文件对话框

    在多线程单元模式(MTA)中为应用程序使用.NET OpenFileDialog和SaveFileDialog 下载FileDialogsThreadAppartmentSafe_v1.zip 如果您 ...

  5. UI Framework-1: Aura Event Handling

    Event Handling A diagram of the architecture of this system:     HWNDMessageHandler owns the WNDPROC ...

  6. TP5使用路由模式报错 No input file specified.

    热烈推荐:超多IT资源,尽在798资源网 application/route.php 是设置路由的文件. 将 route.php 代码修改为 <?php use think\Route; Ro ...

  7. NodeJS学习笔记 进阶 (6)本地调试远程服务器上的Node代码(ok)

    https://github.com/chyingp/nodejs-learning-guide

  8. 记intel杯比赛中各种bug与debug【其一】:安装intel caffe

    因为intel杯创新软件比赛过程中,并没有任何记录.现在用一点时间把全过程重演一次用作记录. 学习 pytorch 一段时间后,intel比赛突然不让用 pytoch 了,于是打算转战intel ca ...

  9. CentOS7.3 下开放防火墙的端口

    CentOS 7.3默认使用的是firewall作为防火墙,这里改为iptables防火墙. 1:关闭firewall: systemctl stop firewalld.service system ...

  10. 洛谷 P1056 排座椅

    P1056 排座椅 题目描述 上课的时候总会有一些同学和前后左右的人交头接耳,这是令小学班主任十分头疼的一件事情.不过,班主任小雪发现了一些有趣的现象,当同学们的座次确定下来之后,只有有限的D对同学上 ...