Axure RP 8.0基础培训教程

第1章 初识Axure RP 8.0 11

1.1 Axure RP 8.0的用途 12

1.2 Axure RP 8.0的工作界面 12

1.2.1 菜单栏 13

1.2.2 工具栏 13

1.2.3 功能区——页面 15

1.2.4 功能区——元件库 15

1.2.5 功能区——母版 16

1.2.6 功能区——设计区域 16

1.2.7 功能区——检视 16

1.2.8 功能区——概要 17

1.2.9 账号的注册与登录 17

1.3 文件的操作 19

1.3.1 新建文件 19

1.3.2 打开文件 20

1.3.3 保存文件 21

1.3.4 导入页面 21

1.3.5 导出页面为图片 22

1.3.6 自动备份设置 23

1.3.7 从备份中恢复 23

1.4 Axure RP 8.0的基础配置 24

1.4.1 网格 24

1.4.2 辅助线 26

1.4.3 对齐元件 31

1.4.4 自定义设计区域中的辅助元素 32

第2章 元件库 35

2.1 基本元件 36

2.1.1 矩形类元件 36

2.1.2 占位符 39

2.1.3 图片 40

2.1.4 水平线和垂直线 42

2.1.5 热区 42

2.1.6 课堂案例：设置文字在鼠标指针悬停时的样式 43

2.2 表单元件 44

2.2.1 文本框和多行文本框 44

2.2.2 下拉列表框 46

2.2.3 列表框 47

2.2.4 复选框 48

2.2.5 单选按钮 48

2.2.6 提交按钮 49

2.2.7 课堂案例：自定义文本框样式 49

2.3 菜单和表格 50

2.3.1 树状菜单 50

2.3.2 水平菜单和垂直菜单 51

2.3.3 表格 52

2.4 动态面板 53

2.4.1 课堂案例：轮播图基础 53

2.4.2 元件介绍 56

2.4.3 课堂案例：“返回顶部”悬浮按钮 59

2.4.4 课堂案例：滚动消息 60

2.5 内联框架 62

2.5.1 课堂案例：实现菜单跳转效果 62

2.5.2 元件介绍 63

2.6 中继器基础 65

2.6.1 课堂案例：基础学生名单 65

2.6.2 元件介绍 66

2.6.3 课堂案例：完善学生名单 69

2.7 标记元件 71

2.7.1 页面快照 72

2.7.2 便签和标记 74

2.7.3 箭头 75

2.8 流程图元件 75

2.8.1 绘制流程图 75

2.8.2 生成页面流程图 76

2.9 课堂练习 76

2.9.1 课堂练习：分类导航的水平拖动效果 77

2.9.2 课堂练习：App信息流 77

2.10 课后习题 77

2.10.1 课后习题：按钮的禁用样式制作 77

2.10.2 课后习题：制作App中的“开关”元件 78

2.10.3 课后习题：切换标签页 78

2.10.4 课后习题：订单列表 78

第3章 母版 79

3.1 母版基础 80

3.2 母版的应用 80

3.2.1 创建母版 80

3.2.2 母版实例 81

3.2.3 母版的拖放行为 81

3.2.4 应用母版 83

3.2.5 移除母版 83

3.3 课后习题：关于母版的思考与练习 84

第4章 交互 85

4.1 交互基础详解 86

4.1.1 课堂案例：弹框的灯箱效果 86

4.1.2 事件、用例和动作 88

4.2 条件用例 90

4.2.1 课堂案例：评论区制作 90

4.2.2 条件用例详解 92

4.2.3 If和Else If 93

4.2.4 课堂案例：登录验证 93

4.3 变量 95

4.3.1 课堂案例：显示登录时所使用的用户名 95

4.3.2 变量详解 97

4.3.3 课堂案例：获取验证码时的倒计时效果 100

4.4 函数 104

4.4.1 课堂案例：自动获取页面名称 104

4.4.2 函数详解 106

4.4.3 函数列表 107

4.4.4 课堂案例：生成4位验证码 111

4.5 母版自定义事件 114

4.5.1 课堂案例：用母版制作菜单被选中时突出显示的效果 114

4.5.2 母版自定义事件详解 118

4.6 课堂练习 121

4.6.1 课堂练习：二级联动下拉菜单 121

4.6.2 课堂练习：增减购物车中的商品数量 121

4.7 课后习题 122

4.7.1 课后习题：登录时增加4位验证码的校验 122

4.7.2 课后习题：利用母版自定义事件显示不同的个人信息 122

第5章 中继器进阶 123

5.1 中继器排序 124

5.1.1 课堂案例：添加排序方式 124

5.1.2 课堂案例：移除排序方式 126

5.2 中继器筛选 127

5.2.1 课堂案例：添加筛选方式 127

5.2.2 课堂案例：移除筛选方式 129

5.3 中继器分页 130

5.3.1 课堂案例：切换分页 130

5.3.2 课堂案例：动态设置每页显示的数据条数 132

5.4 编辑中继器数据集 136

5.4.1 课堂案例：添加行 136

5.4.2 课堂案例：标记行和取消标记行 138

5.4.3 课堂案例：删除行 140

5.4.4 课堂案例：更新行 142

5.5 课堂练习：跨页面添加列表数据 147

5.6 课后习题：Web端商品列表的筛选和排序 147

第6章 原型的分享 149

6.1 生成交互说明书 150

6.1.1 页面说明 150

6.1.2 元件说明 150

6.1.3 生成Word说明书 151

6.1.4 生成CSV报告 154

6.2 利用Axshare在线分享 154

6.2.1 Axshare简介 155

6.2.2 发布和更新原型 155

6.2.3 参与讨论 156

6.2.4 管理原型 157

6.3 生成HTML文件 159

6.3.1 生成本地HTML文件 159

6.3.2 选择生成的页面 160

6.3.3 选择页面说明字段 160

6.3.4 选择元件说明字段 161

6.3.5 设置交互效果的相关内容 162

6.3.6 设置HTML页面左侧工具栏的标志 162

6.3.7 设置Web字体 163

6.3.8 设置字体映射 164

6.3.9 在移动设备中预览App原型 164

6.3.10 高级设置 166

6.3.11 设置是否开放讨论 166

6.4 课堂练习：生成原型的交互说明书 166

6.5 课后习题：练习配置HTML页面 166

第7章 利用Axshare创建和管理团队项目 167

7.1 创建与获取团队项目 168

7.1.1 团队项目工作原理 168

7.1.2 创建团队项目 168

7.1.3 获取团队项目 170

7.2 如何进行团队项目协作 170

7.2.1 签出和签入/获取和提交变更 171

7.2.2 常规管理 172

7.2.3 版本管理 173

7.3 课后习题：体验在团队项目中工作 174

第8章 自定义元件库 175

8.1 认识自定义元件库 176

8.1.1 概述 176

8.1.2 自定义元件库与母版的对比 176

8.2 自定义元件库的使用 176

8.2.1 创建自定义元件库 176

8.2.2 载入自定义元件库 177

8.2.3 卸载自定义元件库 178

8.3 课后习题：制作属于自己的元件库 178

第9章 自适应视图 179

9.1 “响应式布局”与自适应视图 180

9.2 使用自适应视图 180

9.3 课后习题：体验自适应视图 182

第10章 综合案例实训 183

10.1 案例：点赞和取消点赞效果 184

10.2 案例：自定义文本框的交互样式 186

10.3 案例：自定义复选框的交互样式 187

10.4 案例：手风琴导航菜单 188

10.5 案例：局部滚动的筛选菜单 192

10.6 案例： Web端个人中心快捷入口 193

10.7 案例：加载百分比进度条 195

10.8 案例：双向选择列表 197

10.9 课后习题：自定义单选按钮的交互效果 199

10.10 课后习题：自定义下拉列表框的交互样式 199

10.11 课后习题：Web端商品大图切换效果 200

10.12 课后习题：滚动吸附效果 200

第11章 商业案例实训 201

11.1 移动App原型尺寸详解 202

11.2 商业案例：新闻App 202

11.2.1 标签栏菜单切换 202

11.2.2 搜索联想 206

11.2.3 上滑加载更多 210

11.3 商业案例：音乐App 214

11.3.1 启动页倒计时后跳转 214

11.3.2 包含状态指示器的banner广告 217

11.3.3 抽屉菜单 220

11.4 课后习题：制作新闻App的视频和个人中心页面 224