本篇文章主要介绍了" 萌货猫头鹰登录界面动画iOS实现分析",主要涉及到方面的内容,对于IOS开发感兴趣的同学可以参考一下:
原文出处: Dariel在杭州(@Dariel在杭州) 动画效果仿自国外网站readme.io的登录界面,超萌可爱的猫头鹰,具体效果如下图所示.动画实现核心...
原文出处: Dariel在杭州(@Dariel在杭州)
动画效果仿自国外网站readme.io的登录界面,超萌可爱的猫头鹰,具体效果如下图所示.

动画实现核心:
动画核心的是用到了iOS中UIView的transform属性,然后根据尺寸坐标对四张图片进行平移以及缩放.
具体的图层结构如图所示:

注意点:
- 图中只露出两个点的手臂,是不需要裁剪的,有部分是能遮挡粉色view的.所以可以将它们与头部图片放在一个view中.
- 而动画中的手臂只露出粉色文本框以上的部分的方法,是将两个手臂图片添加到一个另外一个View中,然后设置这个View的属性为超过UIView的部分自动裁剪.
核心代码:
Objective-C1 2345678 | //相对于初始位置的平移 self.greenView.transform=CGAffineTransformMakeTranslation(100,0); //相对于上次位置的平移 self.greenView.transform=CGAffineTransformTranslate(self.greenView.transform,100,0); //相对于初始尺寸的缩放,2是倍数 self.greenView.transform=CGAffineTransformMakeScale(2,2); //相对于上次的尺寸缩放0.5倍
|