原创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. java9新特性-18-统一的JVM日志系统

    1.官方Feature 158: Unified JVM Logging 271: Unified GC Logging 2.使用说明 日志是解决问题的唯一有效途径:曾经很难知道导致JVM性能问题和导 ...

  2. canvas指定的宽高写在行间和写在style里面的区别?

    上代码,指定的canvas宽高都一样,线条的粗细都是5px 1.宽:400:高:300:直接写在<canvas>里的效果: 2.删除<canvas>里的宽高,宽:400:高:3 ...

  3. c++几种排序算法代码

    #include <iostream> #include <vector> using namespace std; //交换int void swap(int& a, ...

  4. 初入AngularJS

    AngularJS是一款优秀的前端JS框架,已经被用于Google的多款产品当中.AngularJS有着诸多特性,最为核心的是:MVVM.模块化.自动化双向数据绑定.语义化标签.依赖注入等等. Ang ...

  5. [LNOI2014]LCA 树链剖分 离线 前缀和 思维题

    题目描述:给出一个n个节点的有根树(编号为0到n-1,根节点为0).一个点的深度定义为这个节点到根的距离+1. 设dep[i]表示点i的深度,LCA(i,j)表示i与j的最近公共祖先. 有q次询问,每 ...

  6. JavaScript笔记(3)

    •位操作符 所有的按位操作符的操作数都会被转成补码形式的有符号的32位整数. 运算符 用法 描述 按位与(AND) a & b 对于每一个比特位,只有两个操作数相应的比特位都是1时,结果才为1 ...

  7. 【转】 基于C#.NET的高端智能化网络爬虫 2

    [转] 基于C#.NET的高端智能化网络爬虫2 本篇故事的起因是携程旅游网的一位技术经理,豪言壮举的扬言要通过他的超高智商,完美碾压爬虫开发人员,作为一个业余的爬虫开发爱好者,这样的言论我当然不能置之 ...

  8. Spark技术内幕:Client,Master和Worker 通信源代码解析

    Spark的Cluster Manager能够有几种部署模式: Standlone Mesos YARN EC2 Local 在向集群提交计算任务后,系统的运算模型就是Driver Program定义 ...

  9. mysql通过DATE_FORMAT将错误数据恢复

    因为如今新开发项目,同事造数据的时候,将时间类型格式造成"20150708".可是实际希望的数据格式是:"2015-07-08" . 数据库使用的是mysql. ...

  10. vue13过滤器 debounce延迟、limitBy、filterBy、orderBy

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...