第2章:Springs

在前一章中,您学习了如何创建UIKit的基本动画,包括如何提供起始值和结束值随着时间的UIKit,自动为你创建一个动画。

到目前为止,你的动画一直是单方向的流体运动。当你激活一个视图的位置时,它是一个从A点到B点的简单运动,就像这样:

 

在本章中,您将学习如何创建更复杂的动画,将视图移动到它们与Spring的连接上,如下所示:

 

如果你通过基本动画从A点到B点,在此基础上加点弹性,动画的运动将遵循一个下面的红色箭头指示的路径:

 

箭头从A点到B点,但是超过B点的一小部分,然后箭头又返回B点另一侧一点。这种来回摆动重复直到视图在B点静止为止。

这是一个很好的效果;它增加了一个活泼的,真实的动感,让人切身的感受到你的动画。本章将向您展示如何使用此效果为用户界面添加一点趣味性。

Spring animations弹性动画

您将继续使用上一章的项目;如果您没有完成第1章中的练习(包括第1章最后的挑战),那么您也可以从第2章的资源文件夹中获取启动项目并使用它开始新的征程。

构建和运行你的项目;你应该看到屏幕上的视图(除了登录按钮)在应用程序打开时会有像这样的动画效果:

 

您的任务是处理屏幕上的最后一个非动画元素:登录按钮。

打开项目的视图控制器ViewController,然后将下面的代码添加到viewWillAppear() :方法内的:

self.loginButton.center = CGPointMake(self.loginButton.center.x, self.loginButton.center.y + 30.0);

self.loginButton.alpha = 0.0;

正如前一章所做的那样,在y轴上设置按钮的起始位置稍低一点,并将其alpha值设置为零,使其开始为不可见。

现在viewdidappear()添加以下代码:

[UIView animateWithDuration:0.5 delay:0.5 usingSpringWithDamping:0.5 initialSpringVelocity:0.0 options:nil animations:^{

self.loginButton.center = CGPointMake(self.loginButton.center.x, self.loginButton.center.y - 30.0);

self.loginButton.alpha = 1.0;

} completion:nil];

这段代码有两个要点。

首先,您同时激活了两个不同的属性!这比你想象的容易,对吧?

其次,您第一次使用了一种新的动画方法:

animatewithduration(_:delay: usingSpringWithDamping: initialSpringVelocity: opti ons: animations: completion:)。说方法的名字太快可能会伤害你的舌头!

iOS.Animations.by.Tutorials.v2.0汉化(三)的更多相关文章

  1. iOS.Animations.by.Tutorials.v2.0汉化(二)

    翻译自:iOS.Animations.by.Tutorials.v2.0 第一节(第1章) 动画属性 现在你已经看到了动画是多么的简单,你可能很想知道你的视图控件是怎么动起来的.本节将给你一个UIVi ...

  2. iOS.Animations.by.Tutorials.v2.0汉化

    翻译自:iOS.Animations.by.Tutorials.v2.0 前五章将向你介绍动画API-UIKit框架.这个API是专门设计来帮助你轻松轻而易举的为视图控件赋予生命,同时避免了核心动画的 ...

  3. iOS.Animations.by.Tutorials.v2.0汉化(四)

    第三章 转换 在前面的两章,你学习了如何创建基于视图位置和透明度alpha的动画属性的动画.但是,如果您希望在视图上添加动画或删除动画,您将如何处理呢? 您可以使用前几章的方法来设置进出界面的动画效果 ...

  4. AndroidStudio V2.0.0.汉化

    汉化包下载:http://pan.baidu.com/s/1kVKYUjH AndroidStudio V2.0.x.版汉化工作介绍 resource_en.jar------> resourc ...

  5. UPX3.03+UpolyX.5 Shell v1.0 汉化绿色版

    软件名称:UPX3.03+UpolyX.5 Shell v1.0 汉化绿色版软件类别:汉化软件运行环境:Windows软件语言:简体中文授权方式:免费版软件大小:635 KB软件等级:整理时间:201 ...

  6. Androidstudio2.0.0汉化教程及汉化包。

    ()Eric为大家带来Androidstudio2.0.0的简单汉化教程,许多小伙伴喜欢使用中文版的AS那么没有中文的AS只能靠自己汉化取得更好的体验. 第一步下载AS2.0.0汉化包,我有链接给大家 ...

  7. Erstudio8.0怎么用?Erstudio8.0汉化版详细使用教程

    Erstudio8.0使用教程 打开ERstudio,点击新建出现如图对话框: 选择第一个,表示创建一个新的关系型 数据库模型 这里提一点数据库模型分为relational(关系)和dimension ...

  8. WPBakery Page Builder页面生成器6.0 汉化版

    WPBakery Page Builder 是一个可视化编辑器插件 ,相较于WP自带的编辑器使用起来更加方便,同时功能更 加强大,完全的可视化操作,使用比较简单,国外有多款主题需要使用插件. WPBa ...

  9. phpstorm8.0汉化版下载

    下载地址http://www.52z.com/soft/161911.html 汉化包:http://www.7down.net/soft/20586.html phpStorm汉化方法 1.安装原版 ...

随机推荐

  1. java判断时间大小

    //构造日期格式yyyy-MM-NN SimpleDateFormat formatter = new SimpleDateFormat("yyyy-MM-dd"); Date d ...

  2. Spring MVC的优势

    Spring 框架提供了构建Web应用程序的全功能MVC模块--Spring MVC. Spring MVC框架提供了一个DispatcherServlet作为前端控制器来分派请求,同时提供灵活的配置 ...

  3. 将Flask应用程序部署在nginx,tornado的简单方法

    来自:http://www.xuebuyuan.com/618750.html 在网上搜索了一下部署flask应用的方法,大部分是用wsgi部署在nginx上面,部署了很久,都没有成功,可能是我领悟能 ...

  4. jQuery选择器概述

    1.基本选择器:1) #id : 根据给定的id匹配一个元素:2) .class: 根据给定的类名匹配元素:3)element: 根据给定的元素名匹配元素:4)* : 匹配所有元素:5)selecto ...

  5. JVM基础篇(一)

    JVM简介 JVM(Java虚拟机)是一个虚拟的机器,在实际的计算机上通过软件模拟来实现.JVM有自己的硬件,如处理器.堆栈.寄存器等,还具有相应的指令系统. JVM包括一套字节码指令集.一组寄存器. ...

  6. 如何在Windows上安装多个MySQL

    将MySQL注册为系统服务:%MySQL_HOME%\bin>mysqld --install mysql5.1,此时,在运行中输入"services.msc"或者打开&qu ...

  7. vue2.0路由进阶

    一.路由的模式 第一种用history方式实现,HTML5使用window.history.pushState()实现路由的切换而不刷新页面. 第二种使用hash值的方式来实现. vue2.0两种都可 ...

  8. Redis进阶实践之十 Redis哨兵集群模式

    一.引言             上一篇文章我们详细的讲解了Redis的主从集群模式,其实这个集群模式配置很简单,只需要在Slave的节点上进行配置,Master主节点的配置不需要做任何更改,但是有一 ...

  9. Linux设置系统运行模式

    Linux系统有7个运行级别(runlevel): 运行级别0:系统停机状态,系统默认运行级别不能设为0,否则不能正常启动 运行级别1:单用户工作状态,root权限,用于系统维护,禁止远程登陆 运行级 ...

  10. HTML标签的命名/CSS标准化命名大全

    在一个内容较多的HTML页面中,需要设计许多不同的框架,再为这些不同的框架及内容进行分类,给予相应的名称,从而使得网页结构更加清晰,也为工作提供了方便.许多新手朋友在设计一个HTML文件时,可能只会依 ...