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类在 ...
随机推荐
- 用jquery给select加选中事件
select在前端开发过程中很常用,现在我们要实现一个效果,那就是选中select中的某一项,执行事件,本来自己没怎么接触过这些,最后网上找了一些资料,自己研究了一下,把方法分享给大家,大家如果有需要 ...
- [-] Failed to load plugin from /usr/share/metasploit-framework/plugins/db_autopwn: No classes were loaded from /usr/share/metasploit-framework/plugins/db_autopwn in the Msf::Plugin namespace.
问题详情 然后,执行,出现如下问题,则说明大家的这个文件,下载不是完整的或者你上传不完整. msf > load db_autopwn [-] Failed to load plugin fro ...
- SVN冲突的解决过程
此文教程只是个人记录使用,不建议当教程!(估计新手也看得懵) 改完之后Ctrl+s保存就好.
- 在cncc的最后几天的笔记
数据库范式:http://blog.csdn.net/fg2006/article/details/6936439 数据库事务隔离级别:http://blog.csdn.net/fg2006/arti ...
- 51Nod 不重叠的线段(贪心)
X轴上有N条线段,每条线段有1个起点S和终点E.最多能够选出多少条互不重叠的线段.(注:起点或终点重叠,不算重叠). 例如:[1 5][2 3][3 6],可以选[2 3][3 6],这2条线段互不重 ...
- SSD-tensorflow-2 evaluation
测试就是用voc2007的test set来测试已经训练好的checkpoint的mAP,github上提供了三个已经训练好的model的checkpoint checkpoint 里面已有的300_ ...
- python3 geohash 导入错误及解决
方法一: pip3 install python-geohash 方法二: 1.保证 pip3 install geohash 包 2. 进入包的下载目录 /usr/local/lib/python ...
- CMSIS-RTOS 中断处理Interrupt Handling
RTOS中断处理Interrupt Handling 在RTOS中使用信号来触发线程间的行为是比较简单和高效的,而对于Cortex-M微控制器来讲,从中断源获取信号来触发线程同样是一种重要的方式.虽然 ...
- ECNUOJ 2149 华丽的队列
华丽的队列 Time Limit:3000MS Memory Limit:65536KBTotal Submit:531 Accepted:68 Description 每年,都有很多新同学来到我们 ...
- 怎样使用纯CSS3创建一个简单的五角星图形
我们能够使用SVG.Canvas.CSS3或者背景图片来实现五角星图案及其悬停效果. CSS3引入的伪元素和变换特性使得实现五角星图形很easy,而且能够结合渐变实现更为美丽的效果.因此使用图片实现五 ...