微信小程序与云开发从入门到实践

第 1 章 准备 1

1.1 认识微信小程序 1

1.1.1 小程序的特点 1

1.1.2 小程序的成长之路 2

1.2 如何设计一款小程序 3

1.2.1 小程序的设计原则 3

1.2.2 小程序的适配原则 4

1.3 微信小程序开发前的环境准备 4

1.3.1 注册小程序账号 4

1.3.2 安装开发者工具 7

1.4 小程序版的HelloWorld程序 8

1.4.1 创建一个小程序项目 8

1.4.2 开发者工具的功能详解 10

1.4.3 小程序的真机体验与发布 11

1.4.4 小程序的开发流程 13

1.5 小结与练习 14

第 2 章 微信小程序的构成 15

2.1 小程序项目的基本结构 15

2.1.1 项目目录结构 16

2.1.2 小程序全局配置文件 17

2.1.3 小程序中的页面配置文件 22

2.2 小程序的开发架构 23

2.2.1 注册小程序 23

2.2.2 小程序中页面的注册 24

2.2.3 页面的生命周期 25

2.3 路由与模块化 26

2.3.1 页面路由 27

2.3.2 模块化开发 29

2.4 WXML与WXSS 29

2.4.1 WXML简介 29

2.4.2 WXSS简介 31

2.5 组件与小程序API基础 32

2.5.1 认识组件 32

2.5.2 小程序框架API 33

2.6 小结与练习 34

第 3 章 小程序中的视图容器组件 35

3.1 基础视图组件与滚动视图组件 36

3.1.1 测试工程搭建 36

3.1.2 view（视图）组件 36

3.1.3 scroll-view（滚动视图）组件 38

3.2 滑块容器组件 41

3.2.1 swiper-item组件介绍 41

3.2.2 swiper组件的应用 41

3.3 页面容器组件 43

3.3.1 page-container页面容器示例 43

3.3.2 page-container属性解析 44

3.4 可拖曳容器组件 45

3.4.1 可拖曳容器组件示例 45

3.4.2 movable-area组件与movable-view组件 46

3.5 条件元素容器组件与共享元素容器组件 47

3.5.1 条件元素容器组件的使用 47

3.5.2 共享元素容器组件的使用 48

3.6 组件的布局 49

3.6.1 布局的两个重要概念 49

3.6.2 几种常用的定位方式 50

3.6.3 display属性使用详解 53

3.6.4 控制元素尺寸的标准盒模型 57

3.7 小结与练习 58

第 4 章 小程序中的功能组件 59

4.1 基础功能组件 59

4.1.1 icon组件的应用 59

4.1.2 progress组件的应用 61

4.1.3 text组件的应用 61

4.1.4 rich-text组件的应用 62

4.2 提供用户交互功能的组件 66

4.2.1 button（按钮）组件及应用 66

4.2.2 switch（开关）组件及应用 69

4.2.3 checkbox组件与checkbox-group组件的应用 69

4.2.4 radio组件与radio-group组件及应用 70

4.2.5 input组件与textarea组件及应用 71

4.2.6 editor组件及应用 73

4.2.7 label组件、keyboard-accessory组件与form组件及应用 79

4.2.8 slider（滑块）组件及应用 82

4.2.9 picker组件及应用 83

4.3 动手练习：实现一个简单的小程序登录页面 87

4.4 小结与练习 90

第 5 章 导航、多媒体与高级视图组件 91

5.1 导航组件与页面配置节点组件 91

5.1.1 使用navigator组件 92

5.1.2 页面配置组件 93

5.2 多媒体组件 95

5.2.1 渲染图像的image组件 95

5.2.2 播放音频的audio组件 97

5.2.3 播放视频的video组件 101

5.2.4 捕获影像的camera组件 105

5.2.5 直播与音视频通信相关组件 107

5.3 地图与画布组件 111

5.3.1 map（地图）组件的应用 111

5.3.2 canvas（画布）组件及应用 123

5.4 与微信开放能力相关的组件 125

5.4.1 展示微信开放数据的open-data组件 125

5.4.2 web-view（网页视图）组件 126

5.5 动手练习：开发音乐播放器软件 128

5.5.1 开发音乐播放器首页 128

5.5.2 音频播放页面 132

5.6 小结与练习 135

第 6 章 WeUI组件库 137

6.1 体验WeUI基础组件 137

6.1.1 使用WeUI组件库 138

6.1.2 关于badge组件 138

6.1.3 体验gallery组件 139

6.1.4 体验loading组件 140

6.1.5 体验icon组件 140

6.2 WeUI表单类组件介绍 142

6.2.1 体验WeUI开发的表单页面 142

6.2.2 关于FormPage组件 143

6.2.3 关于Form组件 144

6.2.4 关于Cell与Cells组件 145

6.2.5 关于Checkbox-group与Checkbox组件 146

6.2.6 关于Slideview组件 146

6.2.7 关于Uploader组件 147

6.3 WeUI库中的弹窗和提示类组件 148

6.3.1 Dialog弹窗组件 148

6.3.2 HalfScreenDialog半屏弹窗组件 149

6.3.3 ActionSheet抽屉视图组件 150

6.3.4 Msg组件与TopTips组件 151

6.4 WeUI库中的导航栏与搜索栏组件 153

6.4.1 NavigationBar组件 153

6.4.2 Tabbar组件 154

6.4.3 Searchbar组件 155

6.5 小结与练习 156

第 7 章 自定义组件 157

7.1 自定义组件基础 157

7.1.1 创建一个自定义组件 158

7.1.2 关于Component组件构造器 159

7.1.3 组件的生命周期 161

7.2 关于自定义组件的高级用法 162

7.2.1 自定义组件的模板和样式 162

7.2.2 组件间的通信 165

7.2.3 组件间的依赖关系 167

7.2.4 Behaviors的应用 170

7.2.5 数据监听器 172

7.2.6 关于纯数据字段 173

7.2.7 关于抽象节点 174

7.2.8 自定义组件的性能测试 175

7.3 动手练习：开发一款多Tab页自定义组件 175

7.3.1 动手开发自定义组件 176

7.3.2 使用自定义组件 178

7.4 小结与练习 179

第 8 章 界面相关接口与动画 180

8.1 界面交互相关API的使用 180

8.1.1 关于Toast与Loading组件 181

8.1.2 可交互的用户弹窗和抽屉功能接口 182

8.2 页面尺寸控制与自定义字体 185

8.2.1 调整小程序页面尺寸 185

8.2.2 在小程序中使用自定义字体 186

8.3 页面滚动与下拉刷新相关接口 187

8.3.1 通过API接口使页面滚动到指定的位置 187

8.3.2 下拉刷新相关接口 189

8.4 在小程序中使用动画 190

8.4.1 使用WXSS实现动画效果 190

8.4.2 使用小程序框架接口创建动画效果 192

8.4.3 交互式动画 194

8.5 小结与练习 195

第 9 章 网络与数据存储 197

9.1 在小程序中进行网络数据请求 197

9.1.1 申请接口服务 198

9.1.2 在小程序中调用天气预报API服务 200

9.1.3 请求方法详解 203

9.1.4 关于RequestTask对象 205

9.2 文件下载与上传 206

9.2.1 小程序的文件系统 207

9.2.2 文件下载与上传接口 207

9.3 在小程序中使用WebSocket技术 210

9.3.1 编写一个简易的WebSocket服务端 210

9.3.2 编写WebSocket客户端示例程序 211

9.3.3 WebSocket相关接口详解 212

9.4 小程序文件系统 214

9.4.1 以wx开头的文件系统接口 214

9.4.2 FileSystemManager文件管理器 216

9.5 小程序缓存工具 224

9.6 动手练习：开发一个移动记事本小程序 226

9.6.1 开发应用主页 226

9.6.2 “新建记事”页面的开发 227

9.6.3 “我的记事”页面的开发 229

9.7 小结与练习 231

第 10 章 常用功能接口 232

10.1 系统设置信息与应用级事件相关接口 232

10.2 调试与性能相关接口 237

10.3 小程序中的转发相关接口 242

10.4 用户登录与功能授权 245

10.5 小结与练习 248

第 11 章 云开发技术 249

11.1 云开发基础 249

11.2 使用云数据库 252

11.3 使用云存储 262

11.4 使用云函数 265

11.5 实战：使用云开发技术改造移动记事本应用 274

11.6 小结与练习 277

第 12 章 项目实战：天气预报小程序的开发 278

12.1 数据准备 278

12.2 城市选择模块开发 281

12.3 当日天气模块开发 285

12.4 *近7天天气模块开发 287

12.5 生活指数模块开发 290

第 13 章 项目实战：迷你商城小程序的开发 292

13.1 电商应用首页开发 292

13.2 分类模块开发 308

13.3 商品列表与商品详情页开发 312

13.4 加入购物车与创建订单功能开发 317

13.5 “我的”页面的开发 326