iOS Core Animation具体解释(四)AutoLayout中的动画

本文介绍如何使用AutoLayout在iOS应用中实现平滑的动画效果。通过调整约束中的constant属性并结合layoutIfNeeded方法,演示了一个UIImageView从缩小透明状态平滑过渡到可见且正常大小的过程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

原创blog。转载请注明出处
blog.youkuaiyun.com/hello_hwc
欢迎关注我的iOS SDK具体解释专栏
http://blog.youkuaiyun.com/column/details/huangwenchen-ios-sdk.html


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


先看看效果

20150731133108529


实现过程

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

拖拽Imageview以及Constraint为Outlet

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

20150806132859940
相应代码

 @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

转载于:https://www.cnblogs.com/jzssuanfa/p/7053483.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值