iOS开发iOS Developer

iOS 视图动画

2016-11-14  本文已影响69人  shineDeveloper

这次主要写了关于uikit api的动画实现,首先做一个控件动画显示到屏幕上

核心代码:
override func viewWillAppear(_ animated: Bool) { super.viewWillAppear(animated) heading.center.x -= view.bounds.width; username.center.x -= view.bounds.width; password.center.x -= view.bounds.width; } override func viewDidAppear(_ animated: Bool) { super.viewDidAppear(animated) UIView.animate(withDuration: 0.5, animations: { () -> Void in self.heading.center.x += self.view.bounds.width; }) }

界面上的控件很多,那让控件之间的动画做的很酷,就不能上它们的动画速度相同的设置

UIView.animate(withDuration: 0.5, delay: 0.3, options: [], animations: { () -> Void in self.username.center.x += self.view.bounds.width }, completion: nil)

注意点:uiview的可动画属性,并不是所有的属性都是可以动画的。

用一下方面说明这一点,

1从位置和大小方面

首先对playground做一些介绍,启用pla yGound 显示左边的导航栏

启用导航栏.png

启用助手编辑器

启用编辑器.png

bounds属性,1该变父视图的bounds可以使子视图的bounds发生改变

2.改变控件的frame也可以使视图做动画

外观颜色的动画可以通过background和alpha设置

有关变形的动画可以通过transform进行设置

额外的知识补充完整了,就会到UIView.animate(withDuration: 0.5, delay: 0.4, options: [], animations: { () -> Void in

    }, completion: nil)方法里,op tons 的查看
快速查看options类型.png op tions选项.png

设置动画的重复,和拉大锯效果
UIView.animate(withDuration: 0.5, delay: 0.4, options: [.repeat,.autoreverse], animations: { () -> Void in self.password.center.x += self.view.bounds.width }, completion: nil)
设置动画的缓冲效果curveEaseInOut

效果图为:

效果图.gif
demo下载地址
上一篇 下一篇

猜你喜欢

热点阅读