谈UIView Animation编程艺术

“Action!”,欢迎收看这期大型扯谈实用类技术节目,《小明讲故事》,大家好我是小明!
有人会这么问,“小明,no zuo no die,你觉得哪个城市的人最作?”。“我觉得~伦敦的人比较作,相当作,作得有风格,作得有国际范!因为~有一个伦敦人叫Charlie Chaplin,中文名叫查理 卓别林,小名叫作不停,作界的佛爷啊,嘻嘻~”, “幼稚!!” 。“美国新墨西哥州的人也挺作的,你看《猫和老鼠》中的Tom捉了140集,Jerry还是没有被捉住,作界的二爷呢。” ,“滚!!”。

得动画者得天下啊,有请我们今天的嘉宾哑剧之王–卓别林先生和深爱Jerry的Tom先生。

111252638-e34dbfae11866a13

文章结构图

“卓先生,您也做过电影后期剪切工作,电影的动画是如何形成的呢?”

“在英国把动画叫Animation,它的动词形式是Animate,你们中文意思是“赋予生命”。对于人类来说,眼睛看到一幅画或一个物体后,在0.34秒内不会消失。利用这一原理,在一幅画还没有消失前播放下一幅画,就会给人造成一种流畅的视觉变化效果。对于苍蝇,那就不一样,那叫反应迟钝。”

“哦~卓先生说的应该就是逐帧动画,每一个画面就是一帧,逐一播放形成连续的动画效果。

“Tom先生,您那个时代动画又有什么变化吗?”

“我是看卓先生的电影长大的,1940我才出现在荧屏上。不过有些不一样了,不仅仅单一画面逐一播放,你们可以在《猫和老鼠》中,看到我的胡子被Jerry拉得夸张长,追起Jerry来,身体那些夸张的伸缩,人无法做到的,这也是动漫的魅力。这些动画变化,是可以通过计算机计算每一个时间变化的信息集合成每一帧的画面。 ”

“哦~Tom先生说的应该是关键帧动画。这个在现代技术比较常见的动画制作方式。比如现在大家用的苹果产品,按钮的大小变化,图片的移动,旋转等等这些都是关键帧动画。作为iOS开发者的话,UIView Animation就是属于关键帧动画这一类”。

现代的技术是很先进,挺有味道的,我们一起来领略一下,还得请Tom示范一下。

一.大小动画(改变frame)

1.展示效果

fram大小变化

2.Show Code

二.拉伸动画(改变bounds)

1.展示效果

bounds变化

2.Show Code

三.转移动画(改变center)

1.展示效果

center变化.gif

2.Show Code

谢谢二爷的示范,经典的表情也勾起很多人的回忆。好,我们回到现实,以上的3个例子,大家不难发现共同的特点和重复性。

1.都是改变UIView的属性就可以产生动画。
2.都是带有block做结束回调,对结束监控
3.动画大小和位置变化可以通过多种方式实现

“佛爷,是不是很好奇我们并没有使用Tom先生很多图片组逐一显示?来,也请您下矿一走!”。“哈哈,好!不过那碗河水我还是要倒的”,“行,随你翻腾~”。

四.旋转动画(改变transform)

1.展示效果

transform变化.gif

2.Show Code

五.透明度动画(改变alpha)

1.展示效果

alpha变化.gif

2.Show Code

卓先生,停停停,来,回到我们舞台中间来。就以上5中都能让您玩的这么愉快,以上都是仅仅修改本身的属性值,我再介绍剩下三种基于UIView特别的动画,一个是Keyframe,一个SpringTransition动画。一人一个轮着来,卓先生你先。

六.背景颜色Keyframes动画(改变background)

1.展示效果

background变化.gif

2.Show Code

七.Spring动画(iOS7.0起)

1.展示效果

spring动画.gif

2.Show Code

八.transition动画

1.展示效果

transition动画.gif

2.Show Code

九.关于参数option选择说明

1.UIViewAnimationOptions

2.UIViewKeyframeAnimationOptions

UIView的动画而言,UIViewKeyframeAnimationOptions紧在Keyframes,其余的都是UIViewAnimationOptions

十.总结和扩展

1.UIView动画主要是变化UIView的自带属性
2.UIView动画可以有很多种方式实现同一效果
3.Spring动画iOS7.0以上才有
4.UIViewKeyframeAnimationOptions用着Keyframes动画,其余都用UIViewAnimationOptions枚举
这就以上UIView Animation的动画的基础内容了,节目到了尾声。嘿,卓先生,Tom先生停下来,给大家说byebye啦。谢谢大家,让我们再次以热烈的掌声感谢卓先生和Tom先生。谢谢~~

十一.源码地址

https://github.com/minggo620/iOSViewAnimation
谢谢收看这期大型扯淡实用技术类节目,《小明讲故事》。”Tom老师,你对我眨眼什么意思?”,“你们中国的《喜洋洋和灰太狼》捉了多少集?”

【原创出品 未经授权 禁止转载】
【欢迎微友分享转发 禁止公号等未经授权的转载】

1 2 收藏 评论

相关文章

可能感兴趣的话题



直接登录
跳到底部
返回顶部