iOS10 UI设计基础教程

iOS10 UI设计基础教程

介绍：本教程针对iOS初级开发人员，基于iOS 10系统，使用Swift 3.0语言讲解如何进行UI设计。本教程内容涵盖UI基础构成、UI元素、自动布局、自适应UI、UI动画、UI交互和定制空控件等内容。

试读下载：http://pan.baidu.com/s/1jHRFrFo

目  录

第1章  UI基础 1

1.1  窗口 1

1.1.1  窗口的内容 1

1.1.2  设置起始窗口 1

1.1.3  窗口的工作方式 3

1.2  视图 4

1.2.1  改变视图的外观 4

1.2.2  视图的可见性 4

1.2.3  禁用视图与用户的交互 5

1.2.4  视图的几何形状 6

1.2.5  视图的边界 7

1.2.6  视图的框架 7

1.2.7  视图的中心位置 9

1.3  UI层次结构和Views继承 11

1.3.1  子视图和父视图 11

1.3.2  管理层次结构 12

1.3.3  视图和子视图的可见性 15

1.3.4  层次结构的事件 17

1.3.5  视图调试 18

1.3.6  视图的绘制 22

1.3.7  视图控制器和视图 23

1.3.8  视图的生命周期 23

第2章  UI组件概述——UIKit 27

2.1  文本元素 27

2.1.1  显示文本——普通文本/格式化文本 27

2.1.2  改变文本的外貌 29

2.1.3  单行截断 30

2.1.4  多行文本 31

2.1.5  文本的固定宽度 32

2.1.6  修改文本字体 33

2.1.7  接收用户输入的响应流程 35

2.1.8  用户手动设置输入的文本的格式 35

2.1.9  提示 36

2.1.10  边框样式 40

2.1.11  监听输入 41

2.2  大量文本显示 43

2.2.1  禁用选择 43

2.2.2  自动识别 43

2.2.3  识别类型 44

2.2.4  图文混排 45

2.3  键盘 47

2.3.1  键盘通知 47

2.3.2  键盘输入类型 47

2.4  按钮与选择 52

2.4.1  按钮与用户交互 52

2.4.2  开关选择 54

2.4.3  非精准值的选择 55

2.4.4  多选一 56

2.4.5  精确选择值 60

2.4.6  步进控制 61

2.5  进度条和状态提示 64

2.5.1  进度条 64

2.5.2  状态提示 65

2.6  图像 66

2.6.1  图像视图支持的图像格式 66

2.6.2  让图像适用于多个屏幕 66

2.6.3  图像渲染 68

2.6.4  图像的拉伸 70

2.7  滚动显示 72

2.7.1  滚动视图的组成 73

2.7.2  滚动视图的功能 73

2.7.3  对滚动视图的设置 73

2.7.4  拦截与用户交互时的信息 73

2.7.5  手势缩放 74

2.8  管理和显示结构化数据 75

2.8.1  单列数据 75

2.8.2  多列数据 77

2.9  界面批量定制 82

第3章  自动布局 84

3.1  自动布局的实现方式 84

3.2  构建约束 84

3.2.1  创建一个约束——Ctrl + Drag 84

3.2.2  创建一个约束——Auto Layout Menu自动布局功能按钮 86

3.2.3  查看约束 89

3.2.4  验证约束的正确性 90

3.3  重置约束 91

3.4  内置内容尺寸 93

3.5  屏幕大小自适应 97

3.5.1  考虑因素 97

3.5.2  位置约束 99

3.5.3  大小约束 104

3.6  通过代码更新约束 105

3.7  使用VFL实现自动布局 108

3.7.1  VFL介绍 108

3.7.2  初始化视图 110

3.7.3  添加约束数组 111

3.7.4  设置多个视图 113

3.7.5  视图之间的关系 114

第4章  自适应UI 117

4.1  Size Classes介绍 117

4.2  UI Trait 120

4.2.1  Trait集合和环境 120

4.2.2  使用Trait集合 120

4.3  使用Size Classes构建布局 121

4.3.1  构建布局 121

4.3.2  显示效果 125

4.3.3  使用Image Assets 126

4.4  iOS动态字体 129

4.4.1  配置文本尺寸 129

4.4.2  文本样式 131

4.5  使用UIStackView 133

4.5.1  创建UIStackView 133

4.5.2  UIStackView相关属性 134

4.5.3  实现自适应布局 136

第5章  图层和核心动画 138

5.1  图层 138

5.1.1  图层和视图 138

5.1.2  创建图层 138

5.1.3  图层的几何外观 143

5.1.4  图层的层次结构 145

5.1.5  图层的外观 148

5.2  使用核心动画 151

5.2.1  图层和动画 152

5.2.2  隐式动画 152

5.2.3  基本动画 155

5.2.4  组合动画 158

5.2.5  关键帧动画 160

5.2.6  转场动画 161

5.2.7  移除动画 162

5.2.8  视图动画 163

第6章  UI交互——触摸与手势 164

6.1  事件和触摸 164

6.1.1  触摸阶段 165

6.1.2  UITouch类 165

6.1.3  事件传递 166

6.2  响应者链 166

6.2.1  Hit-testing 167

6.2.2  响应触摸事件 168

6.3  手势和手势识别器 168

6.3.1  使用手势识别器 169

6.3.2  手势识别器状态 170

第7章  构建自定义控件 172

7.1  为什么要设计自定义控件 172

7.2  UIControl类 172

7.3  使用UIControl类制作一个温度控制器 173

7.3.1  初始化控件 174

7.3.2  绘制控件 175

7.3.3  更新控件的值 176

7.3.4  触摸跟踪 178

7.3.5  将控件显示在界面中 180

7.4  发送发作 180

7.5  使用UIAppearance自定义控件 181