文档章节

iOS10 UI设计基础教程

大学霸
 大学霸
发布于 2016/11/10 10:56
字数 1214
阅读 9
收藏 0

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

© 著作权归作者所有

共有 人打赏支持
大学霸
粉丝 250
博文 849
码字总数 535688
作品 0
东城
程序员
iOS10 UI教程基础窗口的内容与设置起始窗口

iOS10 UI教程基础窗口的内容与设置起始窗口 iOS10 UI教程基础窗口的内容与设置起始窗口,本章我们从iOS10开发中UI的基础知识开始讲解,其中包括了窗口、视图以及UI层次结构和Views的继承等内...

大学霸
2016/11/21
17
0
iOS10 UI教程视图和子视图的可见性

iOS10 UI教程视图和子视图的可见性 iOS10 UI教程视图和子视图的可见性,一个父视图可以通过clipsToBounds属性,定义子视图在边界(边界就是父视图的框架也就是父视图可以显示的范围)以外部分...

大学霸
2016/11/25
17
0
iOS10 UI教程基改变视图的外观与视图的可见性

iOS10 UI教程基改变视图的外观与视图的可见性 视图是应用程序的界面,是用户在屏幕上看到的对象。用户可以通过触摸视图上的对象与应用程序进行交互,所以视图界面的优劣会直接影响到了客户体...

大学霸
2016/11/22
9
0
iOS10 UI教程视图的边界与视图的框架

iOS10 UI教程视图的边界与视图的框架 iOS10 UI视图的边界 在视图的几何形状中我们提到了视图属性中的一部分属性可以将定义的视图绘制在屏幕上。其中典型的3个属性为边界属性、框架属性以及中...

大学霸
2016/11/23
20
0
iOS10 UI教程视图的绘制与视图控制器和视图

iOS10 UI教程视图的绘制与视图控制器和视图 iOS10 UI视图的绘制 iOS10 UI教程视图的绘制与视图控制器和视图,在iOS中,有很多的绘图应用。这些应用大多是在UIView上进行绘制的。如果想在一个...

大学霸
2016/11/28
31
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

git +STS使用问题解决一

1. 2.点以一个pull就是更新代码 3.synchronize workSpace 同步代码,同SVN一致

森火
9分钟前
0
0
powerBi odbc 连接impala 实现自助分析

配置Impala以使用ODBC 可以将第三方产品设计为使用ODBC与Impala集成。为获得最佳体验,请确保支持您打算使用的任何第三方产品。验证支持包括检查Impala,ODBC,操作系统和第三方产品的版本是...

hblt-j
13分钟前
0
0
Purism FAQ

<font size="37" color="#006248" face="幼圆"> <p align="center"> Purism FAQ </p> </font> 原文:https://puri.sm/faq/ 原作者:Purism Team 翻译者:冰焰火灵X 1079092922@qq.com 文章许......

ICE冰焰火灵X
29分钟前
0
0
nginx+webdav

1、配置Nginx以支持WebDav: Webdav是nginx一个组件,默认编译nginx时是没有安装这个组件的。 如果跟应用公用一个nginx,需要重新编译安装nginx,重新安装前需要备份好原来的nginx.conf。 1....

yaukie
34分钟前
0
0
spring 事件

ContextRefreshedEvent Event raised when an {@code ApplicationContext} gets initialized or refreshed. ContextClosedEvent Event raised when an {@code ApplicationContext} gets clos......

Canaan_
46分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部