微信小程序應用開發

第1章 建立微信小程序開發環境 1
1.1　初識微信小程序 2
1.1.1 微信小程序舉例 2
1.1.2 微信小程序VS移動應用程序 4
1.2　安裝微信開發者工具 4
1.2.1 下載及安裝微信開發者工具 4
1.2.2 創建和運行第一個微信小程序 6
1.2.3 在手機上預覽/運行微信小程序 9
1.2.4 AppID 9
1.3　微信開發者工具簡介 10
1.4　練習：建立自己的微信小程序開發環境 11
第2章 剖析微信小程序 12
2.1　小程序工程結構 13
2.2　小程序配置及app.json文件 15
2.2.1 小程序頁面配置 16
2.2.2 渲染引擎及其配置 16
2.2.3 小程序組件樣式配置和小程序搜索配置 18
2.2.4 微信客戶端的版本號與小程序基礎庫的版本號 18
2.3　小程序生命周期及app.js文件 19
2.3.1 微信小程序的運行過程及其生命周期 19
2.3.2 小程序生命周期函數及其舉例 20
2.4　小程序全局樣式及app.wxss文件 23
2.4.1 小程序頁面寬度尺寸單位 24
2.4.2 樣式導入 24
2.5　小程序頁面及其構成 24
2.5.1 頁面.wxml文件 25
2.5.2 頁面.wxss文件 25
2.5.3 頁面.json文件 26
2.5.4 頁面.js文件 27
2.5.5 簡單的可以交互的小程序 29
2.6　案例：美圖欣賞 32
2.6.1 案例目標 32
2.6.2 案例分析 33
2.6.3 案例實施 33
2.7　練習：童年記憶 37
第3章 微信小程序核心框架 38
3.1　數據綁定 39
3.1.1 數據綁定入門舉例 39
3.1.2 數據綁定及其使用 40
3.1.3 全局數據及其使用 42
3.1.4 使用console和定時器 44
3.2　事件系統 45
3.2.1 簡單的事件綁定 45
3.2.2 冒泡事件和非冒泡事件 45
3.2.3 綁定事件並阻止事件冒泡 46
3.2.4 事件對象 46
3.2.5 通過事件從視圖層向邏輯層傳遞參數 47
3.2.6 數據綁定和事件系統使用舉例 48
3.3　模塊化 50
3.4　WXS腳本 51
3.4.1 一個簡單的WXS腳本入門例子 51
3.4.2 WXS模塊及其使用 52
3.4.3 WXS語法基礎 55
3.4.4 使用WXS響應事件 56
3.5　案例：圖來圖往 57
3.5.1 案例目標 57
3.5.2 案例分析 58
3.5.3 案例實施 58
3.6　練習：單擊計數器 60
第4章 小程序組件—Part 1 61
4.1　組件基本屬性 62
4.2　常用組件 62
4.2.1 view組件 62
4.2.2 button組件 64
4.2.3 icon組件 67
4.2.4 text組件 67
4.2.5 image組件 68
4.2.6 progress組件 68
4.3　表單組件 69
4.3.1 form組件 69
4.3.2 input組件 69
4.3.3 checkbox組件和checkbox-group組件 70
4.3.4 radio組件和radio-group組件 71
4.3.5 label組件 71
4.3.6 picker組件和數據雙向綁定 71
4.3.7 picker-view組件和picker-view-column組件 75
4.3.8 slider組件 78
4.3.9 switch組件 78
4.3.10 textarea組件 79
4.4　條件渲染和列表渲染 80
4.4.1 條件渲染 80
4.4.2 列表渲染 80
4.4.3 WXML模板：template標簽 82
4.4.4 WXML引用：import標簽和include標簽 83
4.5　全局頁面的下拉刷新和上拉加載 83
4.6　案例：簡單計算器 86
4.6.1 案例目標 86
4.6.2 案例分析 87
4.6.3 案例實施 87
4.7　練習：你點我應 89
第5章 小程序組件—Part 2 90
5.1　scroll-view組件 91
5.1.1 scroll-view組件的使用舉例 92
5.1.2 使用scroll-view組件實現局部頁面的下拉刷新和上拉加載 93
5.2　swiper組件和swiper-item組件 95
5.3　navigator組件 97
5.4　tabBar及其使用 100
5.5　媒體組件 103
5.5.1 audio組件 104
5.5.2 video組件 104
5.5.3 camera組件 107
5.6　canvas組件 109
5.7　自定義組件 109
5.7.1 創建自定義組件 109
5.7.2 使用自定義組件 110
5.7.3 自定義組件舉例 111
5.7.4 使用第三方WeUI組件庫 112
5.8　案例：美食餐廳 115
5.8.1 案例目標 115
5.8.2 案例分析 115
5.8.3 案例實施 115
5.9　練習：選修課 121
第6章 小程序API—Part 1 122
6.1　基礎API 123
6.1.1 獲取系統信息 123
6.1.2 獲取設備信息 125
6.2　界面API 126
6.2.1 交互API 126
6.2.2 TabBar操作API 130
6.2.3 動畫API 131
6.3　路由API 136
6.3.1 頁面跳轉API 136
6.3.2 路由API使用舉例 138
6.4　數據緩存API 141
6.4.1 保存數據 141
6.4.2 讀取數據 141
6.4.3 清除數據 142
6.4.4 獲取數據緩存狀態 142
6.4.5 數據緩存使用舉例 143
6.5　文件系統操作API 145
6.5.1 打開文檔 145
6.5.2 使用FileSystemManager對象操作文件 146
6.6　媒體API 148
6.6.1 圖像API 148
6.6.2 視頻API 152
6.6.3 音頻API 154
6.6.4 錄音API 156
6.6.5 相機API 158
6.7　案例：自制錄音播放器 159
6.7.1 案例目標 160
6.7.2 案例分析 160
6.7.3 案例實施 160
6.8　練習：視頻錄制播放器 162
第7章 小程序API—Part 2 163
7.1　網絡通信API 164
7.1.1 獲取網絡狀態和網絡IP地址API 164
7.1.2 圖書信息服務器 165
7.1.3 發起請求 168
7.1.4 文件下載 169
7.1.5 文件上傳 170
7.1.6 網絡通信API應用綜合舉例 170
7.2　分享/轉發API 173
7.2.1 分享/轉發小程序頁面 173
7.2.2 分享/轉發小程序頁面內的信息 174
7.2.3 分享/轉發API應用舉例 175
7.3　設備API 177
7.3.1 掃碼API 177
7.3.2 振動控制API 178
7.3.3 設備API使用舉例 178
7.4　開放接口API 179
7.4.1 獲取用戶頭像信息 179
7.4.2 小程序登錄 181
7.4.3 授權和設置 185
7.5　案例：在線相冊 187
7.5.1 案例目標 187
7.5.2 案例分析 187
7.5.3 案例實施 188
7.6　練習：讀書分享 192
第8章 小程序AI 193
8.1　VisionKit視覺庫簡介 194
8.2　創建視覺會話 194
8.3　人臉檢測 195
8.4　人體檢測 200
8.5　手勢檢測 201
8.6　OCR檢測 204
8.7　案例：基於手勢的圖像顯示控制 207
8.7.1 案例目標 207
8.7.2 案例分析 207
8.7.3 案例實施 207
8.8　練習：從圖像中檢測人臉 210
第9章 小程序雲開發 211
9.1　雲開發入門 212
9.1.1 雲開發前必讀 212
9.1.2 開通雲開發 212
9.1.3 雲開發控制臺使用基礎 214
9.1.4 雲開發入門舉例 215
9.2　初始化雲開發環境 224
9.3　開發數據庫 225
9.3.1 數據類型 225
9.3.2 新建集合和數據訪問權限控制 226
9.3.3 插入數據 226
9.3.4 修改數據 227
9.3.5 刪除數據 230
9.3.6 查詢數據 230
9.3.7 雲開發數據庫核心對象和核心方法總覽 233
9.4　雲開發存儲 234
9.4.1 上傳文件到雲開發存儲 235
9.4.2 從雲開發存儲下載文件 236
9.4.3 刪除雲開發存儲中的文件 237
9.4.4 引用雲文件 237
9.5　雲函數 238
9.5.1 配置雲函數環境 238
9.5.2 新建雲函數 238
9.5.3 在小程序中調用雲函數 240
9.5.4 在雲函數中進行雲操作 241
9.5.5 在雲函數中獲取小程序用戶信息 242
9.6　案例：在線競選班長 245
9.6.1 案例目標 245
9.6.2 案例分析 246
9.6.3 案例實施 246
9.7　練習：個人財務 253
第10章 綜合案例：校園二手貨交易 254
10.1　需求清單 255
10.2　界面設計 255
10.2.1 界面設計構思 255
10.2.2 界面詳細設計 256
10.3　雲數據庫設計 257
10.4　案例實施 258
10.4.1 app.js文件 259
10.4.2 雲函數gopenid 259
10.4.3 雲函數iwant 259
10.4.4 雲函數search 260
10.4.5 “搜索”頁面 261
10.4.6 “二手貨詳細信息”頁面 262
10.4.7 “二手貨購買意向”頁面 263
10.4.8 “發布”頁面 265
10.4.9 “我的發布”頁面 268
10.4.10 “查看購買意向”頁面 269
10.4.11 “修改二手貨狀態”頁面 270
10.4.12 “我的購買”頁面 271
10.4.13 “我的購買詳細信息”頁面 272
10.5　運行效果 273
10.6　練習：完善二手貨交易小程序 273
第11章 小程序發布 274
11.1　編譯和預覽 274
11.2　上傳代碼 275
11.3　提交審核 275
11.4　發布 275