ASP源码.NET源码PHP源码JSP源码JAVA源码DELPHI源码PB源码VC源码VB源码Android源码
当前位置:首页 >> 低调看直播体育app软件下载 >> IOS开发 >> 萌货猫头鹰登录界面动画iOS实现分析

萌货猫头鹰登录界面动画iOS实现分析(1/9)

来源:网络整理     时间:2016-08-29     关键词:

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

原文出处: Dariel在杭州(@Dariel在杭州)   

动画效果仿自国外网站readme.io的登录界面,超萌可爱的猫头鹰,具体效果如下图所示.

 萌货猫头鹰登录界面动画iOS实现分析

动画实现核心:

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

 萌货猫头鹰登录界面动画iOS实现分析

注意点:

  • 图中只露出两个点的手臂,是不需要裁剪的,有部分是能遮挡粉色view的.所以可以将它们与头部图片放在一个view中.
  • 而动画中的手臂只露出粉色文本框以上的部分的方法,是将两个手臂图片添加到一个另外一个View中,然后设置这个View的属性为超过UIView的部分自动裁剪.

核心代码:

Objective-C

1

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倍

相关图片

相关文章