iOS Core Animation具体解释(四)AutoLayout中的动画
原创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中的动画的更多相关文章
- iOS - Core Animation 核心动画
1.UIView 动画 具体讲解见 iOS - UIView 动画 2.UIImageView 动画 具体讲解见 iOS - UIImageView 动画 3.CADisplayLink 定时器 具体 ...
- iOS Core Animation 简明系列教程
iOS Core Animation 简明系列教程 看到无数的CA教程,都非常的难懂,各种事务各种图层关系看的人头大.自己就想用通俗的语言翻译给大家听,尽可能准确表达,如果哪里有问题,请您指出我会尽 ...
- 转 iOS Core Animation 动画 入门学习(一)基础
iOS Core Animation 动画 入门学习(一)基础 reference:https://developer.apple.com/library/ios/documentation/Coco ...
- iOS——Core Animation 知识摘抄(四)
原文地址http://www.cocoachina.com/ios/20150106/10840.html 延迟解压 一旦图片文件被加载就必须要进行解码,解码过程是一个相当复杂的任务,需要消耗非常长的 ...
- IOS Core Animation Advanced Techniques的学习笔记(四)
第五章:Transforms Affine Transforms CGAffineTransform是二维的 Creating a CGAffineTransform 主要有三种变 ...
- iOS——Core Animation 知识摘抄(二)
阴影 主要是shadowOpacity .shadowColor.shadowOffset和shadowRadius四个属性 shadowPath属性 我们已经知道图层阴影并不总是方的,而是从图层内容 ...
- IOS Core Animation Advanced Techniques的学习笔记(五)
第六章:Specialized Layers 类别 用途 CAEmitterLayer 用于实现基于Core Animation粒子发射系统.发射器层对象控制粒子的生成和起源 CAGradient ...
- iOS——Core Animation 知识摘抄(三)
原文地址:http://www.cocoachina.com/ios/20150105/10827.html CAShapeLayer CAShapeLayer是一个通过矢量图形而不是bitmap来绘 ...
- iOS——Core Animation 知识摘抄(一)
本文是对http://www.cocoachina.com/ios/20150104/10814.html文章的关键段落的摘抄,有需要的看原文 CALayer和UIView的关系: CALayer类在 ...
随机推荐
- 再谈Ubuntu和CentOS安装好之后的联网问题(桥接和NAT、静态和动态ip)(博主推荐)
不多说,直接上干货! 首先,普及概念. hostonly.桥接和NAT的联网方式 对于CentOS系统,用的最多的就是,NAT和桥接模式 CentOS 6.5静态IP的设置(NAT和桥接联网方式都适用 ...
- kindeditor 不能编辑 问题
/*显示上传窗体*/ function ShowUplodToDaily() { var _sdata = grid.getSelecteds(); if (_sdata) { /*创建编辑器*/ v ...
- benchmark测试PostgreSQL数据库OLTP性能
1,安装配置PostgreSQL数据库 2,下载地址:http://sourceforge.net/projects/benchmarksql/?source=navbar Required:JDK7 ...
- C#线程安全打开/保存文件对话框
在多线程单元模式(MTA)中为应用程序使用.NET OpenFileDialog和SaveFileDialog 下载FileDialogsThreadAppartmentSafe_v1.zip 如果您 ...
- UI Framework-1: Aura Event Handling
Event Handling A diagram of the architecture of this system: HWNDMessageHandler owns the WNDPROC ...
- TP5使用路由模式报错 No input file specified.
热烈推荐:超多IT资源,尽在798资源网 application/route.php 是设置路由的文件. 将 route.php 代码修改为 <?php use think\Route; Ro ...
- NodeJS学习笔记 进阶 (6)本地调试远程服务器上的Node代码(ok)
https://github.com/chyingp/nodejs-learning-guide
- 记intel杯比赛中各种bug与debug【其一】:安装intel caffe
因为intel杯创新软件比赛过程中,并没有任何记录.现在用一点时间把全过程重演一次用作记录. 学习 pytorch 一段时间后,intel比赛突然不让用 pytoch 了,于是打算转战intel ca ...
- CentOS7.3 下开放防火墙的端口
CentOS 7.3默认使用的是firewall作为防火墙,这里改为iptables防火墙. 1:关闭firewall: systemctl stop firewalld.service system ...
- 洛谷 P1056 排座椅
P1056 排座椅 题目描述 上课的时候总会有一些同学和前后左右的人交头接耳,这是令小学班主任十分头疼的一件事情.不过,班主任小雪发现了一些有趣的现象,当同学们的座次确定下来之后,只有有限的D对同学上 ...