第九章 动画和效果

本项目是《beginning iOS8 programming with swift》中的项目学习笔记==》全部笔记目录

------------------------------------------------------------------------------------------------------------------

1.    拖拽一个ToolBar到Detail控制器中的Table下面,设置好约束,使其停靠在视图的最下方。
2.    再拖一个Bar Button Item到工具栏上,设置identifier一个为Action,一个为Compose,再拖个弹簧给隔开。
3.    在didFinishLaunchingWithOptions方法中:

// 设置Toolbar按钮的文字颜色
UIBarButtonItem.appearance().tintColor = UIColor.whiteColor()
// 设置Toolbar背景色
UIToolbar.appearance().barTintColor = UIColor.orangeColor()

效果图:

4. 增加Restaurant review界面:拖一个View Controller进去,再拖一个Image View进去,作为背景图片,设置image为cafeloisl。
5. 在Image View上面拖一个View(45,102,231,242),设置background为default(透明)。拖一个Label进去,设置title为“You’ve dined here. What did you think?”。拖三个按钮进去,设置title为空,image分别为:bad、good、great。设置按钮的background为orange,tint为white(需要修改type为system)。在右上角拖一个按钮,设置title为空,image为:close。
效果图:

6. 从compose按钮拖一条segue到review界面,选择modal,设置identifier为showReview。
7. 设置按钮为圆角:在IB中的User defined runtime attributes里,添加一个key:layer.cornerRadius,Type:Number,Value:30。
8. 关闭review界面:在Detail控制器中增加一个方法:

@IBAction func close(segue:UIStoryboardSegue) {
}

然后从关闭按钮拖动到Exit图标,选择close。
8. 给背景增加模糊效果:
增加一个继承自UIViewController的控制器类ReviewViewController,增加一个成员变量:

@IBOutlet weak var backgroundImageView:UIImageView!

接着在viewDidLoad方法中:

var blurEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light))
blurEffectView.frame = view.bounds
backgroundImageView.addSubview(blurEffectView)

效果图:

9. 增加动画效果:
9.1 先增加一个成员变量并关联控件:

@IBOutlet weak var dialogView: UIView!

在viewDidLoad方法中:

dialogView.transform = CGAffineTransformMakeScale(0.0, 0.0)

增加viewDidAppear方法:

override func viewDidAppear(animated: Bool) {
    // damping越小,振幅越大
    UIView.animateWithDuration(0.7, delay: 0.0, usingSpringWithDamping: 0.5, initialSpringVelocity: 0.5, options: nil, animations: { () -> Void in
        self.dialogView.transform = CGAffineTransformIdentity
    }, completion: nil)
}

即可实现dialogView从小变大的动画。
9.2 将viewDidLoad方法中的语句换成:

dialogView.transform = CGAffineTransformMakeTranslation(0, 500)

即可实现从下到上出现的动画。
9.3 将viewDidLoad方法中的语句换成:

let scale = CGAffineTransformMakeScale(0.0, 0.0)
let translate = CGAffineTransformMakeTranslation(0, 500)
dialogView.transform = CGAffineTransformConcat(scale, translate)

即可综合两种动画。
 
提高:
自己实现分享页面(提示:需要使用delay参数。):

时间: 03-02

第九章 动画和效果的相关文章

现代软件工程 第九章 练习与讨论

9.5.1  PM们的故事 讲了这么多条条框框,我们还是来讲几个故事吧. A)是不是所有的好功能都是由PM主导,一步一步根据用户需求,按照用户场景设计,然后进行可用性测试等等步骤之后得来的呢? 功能本天成,妙手偶得之——一个来自微软的故事 约摸在1985年,微软的一个叫Steve Hazelrig的工程师正在写Mac Excel 版本的打印功能,那时候激光打印机很贵,而且离办公室也不近.他懒得经常跑到打印机那儿取打印纸检查打印效果,就写了一个小程序,把要输出到打印机的图像显示在屏幕上,还有一个放

深入浅出Zabbix 3.0 -- 第九章 数据可视化

第九章 数据可视化 Zabbix是一个非常灵活.强大的监控系统,它不仅能够监控大量不同类型的数据指标,并为这些数据及数据之间的关联提供了多种可视化工具,通过图形.展示屏.网络拓扑图等将数据直观的展现出来,实时的浏览和查看监控设备的状态. 9.1 图形 Zabbix 3.0中支持三种graphs(图形),即simple graphs(简单图形).ad-hocgraphs(自组图形)和customgraphs(自定义图形). 9.1.1 简单图形 简单图形是Zabbix系统内置的一种方法,为监控项数

JavaScript DOM编程艺术-学习笔记(第八章、第九章)

第八章 1.小知识点: ①某些浏览器要根据DOCTYPE 来决定页面的呈现模式(标准模式 / 怪异模式--也称兼容模式): 兼容模式意味着浏览器要模仿老一辈的浏览器的怪异行为,来让老站点得到运行,并让不规范的页面得到运行. 使用时应避免出发兼容模式. html5 DOCTYPE默认的是标准模式 ②abbr标签--简称.缩写.此标签到ie7才被ie支持 2.js只能充实文档内容,避免使用dom技术来创建核心内容.    避免使用dom设置重要样式 第九章 1.css正在利用伪类(例如:hover.

Android学习笔记—第九章 Activity的加载模式

第九章 Activity的加载模式 task:类似于栈,每次打开界面会创建一个task,然后将这开启的界面放入到该task中. (1)standard:默认模式 每次都会创建一个新的界面,将该界面加入task中 (2)singleTop:栈顶单实例模式 a. 如果目标Activity不存在,创建一个新的Activity,存入到task中 b. 如果目标Activity已经存在,并且处于栈顶,不会再创建新的Activity c. 如果目标Activity已经存在,但不处于栈顶,创建一个新的Acti

javascript高级程序设计 第九章-- 客户端检测

javascript高级程序设计 第九章-- 客户端检测 客户端检测是javascript开发中最具争议的一个话题,由于浏览器间存在差别,通常需要根据不同浏览器的能力分别编写不同的代码.有下列常使用的客户端检测方法:能力检测:在编写代码之前先检测特定浏览器的能力.例如,脚本在调用某个函数之前,可能要先检测该函数是否存在.这种检测方法将开发人员从考虑具体的浏览器类型和版本中解放出来,让他们把注意力集中到相应的能力是否存在上.能力检测无法精确地检测特定的浏览器和版本.怪癖检测:怪癖实际上是浏览器中存

zabbix专题:第九章 自定义key(案例:监控内存,监控nginx状态)

第九章 自定义key 对Linux有兴趣的朋友加入QQ群:476794643 在线交流 本文防盗链:http://zhang789.blog.51cto.com 为什么要自定义KEY 有时候我们想让被监控端执行一个zabbix没有预定义的检测,zabbix的用户自定义参数功能提供了这个方法.我们可以在客户端配置文件zabbix_angentd.conf里面配置UserParameter. 语法如下: UserParameter=key,command 用户自定义参数包含一个key和一个命令,ke

html5 canvas首屏自适应背景动画循环效果代码

模板描述:html5 canvas首屏自适应背景动画循环效果代码 由于动态图太大,怕以后服务器受不了,所以现在都改为静态图了,大家点击演示地址一样的,希望大家喜欢,你们的支持就是小海的动力!! 欢迎大家积极评论,给出宝贵意见 下 载 演示地址 本文地址:html5 canvas首屏自适应背景动画循环效果代码

读书笔记第九章

第九章HAL是建立在linux驱动之上的一套程序库.这套程序库并不属于linux内核,而是属于linux内核层之上的应用层.可以用来保护不想公开源代码的作者.HAL架构比较简单,其基本原理就是在安卓系统中使用程序库调用位于内核空间的linux驱动,然后安卓应用程序可以通过NDK程序访问HAL中的程序库,或直接在安卓应用程序中访问HAL中的程序库.编写一款支持HAL的linux驱动程序的步骤:1.编写linux驱动,linux驱动的代码要尽量简介,尽可能将业务逻辑放到HAL library中.2.

第九章 两种模式的比较

#include <sys/types.h> #include <sys/socket.h> #include <netinet/in.h> #include <arpa/inet.h> #include <assert.h> #include <stdio.h> #include <unistd.h> #include <errno.h> #include <string.h> #include

第九章 用多线程来读取epoll模型下的客户端数据

#include <sys/types.h> #include <sys/socket.h> #include <netinet/in.h> #include <arpa/inet.h> #include <assert.h> #include <stdio.h> #include <unistd.h> #include <errno.h> #include <string.h> #include