微信小程序與云開(kāi)發(fā)從入門(mén)到實(shí)踐

第 1 章 準(zhǔn)備 1
1.1 認(rèn)識(shí)微信小程序 1
1.1.1 小程序的特點(diǎn) 1
1.1.2 小程序的成長(zhǎng)之路 2
1.2 如何設(shè)計(jì)一款小程序 3
1.2.1 小程序的設(shè)計(jì)原則 3
1.2.2 小程序的適配原則 4
1.3 微信小程序開(kāi)發(fā)前的環(huán)境準(zhǔn)備 4
1.3.1 注冊(cè)小程序賬號(hào) 4
1.3.2 安裝開(kāi)發(fā)者工具 7
1.4 小程序版的HelloWorld程序 8
1.4.1 創(chuàng)建一個(gè)小程序項(xiàng)目 8
1.4.2 開(kāi)發(fā)者工具的功能詳解 10
1.4.3 小程序的真機(jī)體驗(yàn)與發(fā)布 11
1.4.4 小程序的開(kāi)發(fā)流程 13
1.5 小結(jié)與練習(xí) 14
第 2 章 微信小程序的構(gòu)成 15
2.1 小程序項(xiàng)目的基本結(jié)構(gòu) 15
2.1.1 項(xiàng)目目錄結(jié)構(gòu) 16
2.1.2 小程序全局配置文件 17
2.1.3 小程序中的頁(yè)面配置文件 22
2.2 小程序的開(kāi)發(fā)架構(gòu) 23
2.2.1 注冊(cè)小程序 23
2.2.2 小程序中頁(yè)面的注冊(cè) 24
2.2.3 頁(yè)面的生命周期 25
2.3 路由與模塊化 26
2.3.1 頁(yè)面路由 27
2.3.2 模塊化開(kāi)發(fā) 29
2.4 WXML與WXSS 29
2.4.1 WXML簡(jiǎn)介 29
2.4.2 WXSS簡(jiǎn)介 31
2.5 組件與小程序API基礎(chǔ) 32
2.5.1 認(rèn)識(shí)組件 32
2.5.2 小程序框架API 33
2.6 小結(jié)與練習(xí) 34
第 3 章 小程序中的視圖容器組件 35
3.1 基礎(chǔ)視圖組件與滾動(dòng)視圖組件 36
3.1.1 測(cè)試工程搭建 36
3.1.2 view（視圖）組件 36
3.1.3 scroll-view（滾動(dòng)視圖）組件 38
3.2 滑塊容器組件 41
3.2.1 swiper-item組件介紹 41
3.2.2 swiper組件的應(yīng)用 41
3.3 頁(yè)面容器組件 43
3.3.1 page-container頁(yè)面容器示例 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 布局的兩個(gè)重要概念 49
3.6.2 幾種常用的定位方式 50
3.6.3 display屬性使用詳解 53
3.6.4 控制元素尺寸的標(biāo)準(zhǔn)盒模型 57
3.7 小結(jié)與練習(xí) 58
第 4 章 小程序中的功能組件 59
4.1 基礎(chǔ)功能組件 59
4.1.1 icon組件的應(yīng)用 59
4.1.2 progress組件的應(yīng)用 61
4.1.3 text組件的應(yīng)用 61
4.1.4 rich-text組件的應(yīng)用 62
4.2 提供用戶交互功能的組件 66
4.2.1 button（按鈕）組件及應(yīng)用 66
4.2.2 switch（開(kāi)關(guān)）組件及應(yīng)用 69
4.2.3 checkbox組件與checkbox-group組件的應(yīng)用 69
4.2.4 radio組件與radio-group組件及應(yīng)用 70
4.2.5 input組件與textarea組件及應(yīng)用 71
4.2.6 editor組件及應(yīng)用 73
4.2.7 label組件、keyboard-accessory組件與form組件及應(yīng)用 79
4.2.8 slider（滑塊）組件及應(yīng)用 82
4.2.9 picker組件及應(yīng)用 83
4.3 動(dòng)手練習(xí)：實(shí)現(xiàn)一個(gè)簡(jiǎn)單的小程序登錄頁(yè)面 87
4.4 小結(jié)與練習(xí) 90
第 5 章 導(dǎo)航、多媒體與高級(jí)視圖組件 91
5.1 導(dǎo)航組件與頁(yè)面配置節(jié)點(diǎn)組件 91
5.1.1 使用navigator組件 92
5.1.2 頁(yè)面配置組件 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 直播與音視頻通信相關(guān)組件 107
5.3 地圖與畫(huà)布組件 111
5.3.1 map（地圖）組件的應(yīng)用 111
5.3.2 canvas（畫(huà)布）組件及應(yīng)用 123
5.4 與微信開(kāi)放能力相關(guān)的組件 125
5.4.1 展示微信開(kāi)放數(shù)據(jù)的open-data組件 125
5.4.2 web-view（網(wǎng)頁(yè)視圖）組件 126
5.5 動(dòng)手練習(xí)：開(kāi)發(fā)音樂(lè)播放器軟件 128
5.5.1 開(kāi)發(fā)音樂(lè)播放器首頁(yè) 128
5.5.2 音頻播放頁(yè)面 132
5.6 小結(jié)與練習(xí) 135
第 6 章 WeUI組件庫(kù) 137
6.1 體驗(yàn)WeUI基礎(chǔ)組件 137
6.1.1 使用WeUI組件庫(kù) 138
6.1.2 關(guān)于badge組件 138
6.1.3 體驗(yàn)gallery組件 139
6.1.4 體驗(yàn)loading組件 140
6.1.5 體驗(yàn)icon組件 140
6.2 WeUI表單類(lèi)組件介紹 142
6.2.1 體驗(yàn)WeUI開(kāi)發(fā)的表單頁(yè)面 142
6.2.2 關(guān)于FormPage組件 143
6.2.3 關(guān)于Form組件 144
6.2.4 關(guān)于Cell與Cells組件 145
6.2.5 關(guān)于Checkbox-group與Checkbox組件 146
6.2.6 關(guān)于Slideview組件 146
6.2.7 關(guān)于Uploader組件 147
6.3 WeUI庫(kù)中的彈窗和提示類(lèi)組件 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庫(kù)中的導(dǎo)航欄與搜索欄組件 153
6.4.1 NavigationBar組件 153
6.4.2 Tabbar組件 154
6.4.3 Searchbar組件 155
6.5 小結(jié)與練習(xí) 156
第 7 章 自定義組件 157
7.1 自定義組件基礎(chǔ) 157
7.1.1 創(chuàng)建一個(gè)自定義組件 158
7.1.2 關(guān)于Component組件構(gòu)造器 159
7.1.3 組件的生命周期 161
7.2 關(guān)于自定義組件的高級(jí)用法 162
7.2.1 自定義組件的模板和樣式 162
7.2.2 組件間的通信 165
7.2.3 組件間的依賴(lài)關(guān)系 167
7.2.4 Behaviors的應(yīng)用 170
7.2.5 數(shù)據(jù)監(jiān)聽(tīng)器 172
7.2.6 關(guān)于純數(shù)據(jù)字段 173
7.2.7 關(guān)于抽象節(jié)點(diǎn) 174
7.2.8 自定義組件的性能測(cè)試 175
7.3 動(dòng)手練習(xí)：開(kāi)發(fā)一款多Tab頁(yè)自定義組件 175
7.3.1 動(dòng)手開(kāi)發(fā)自定義組件 176
7.3.2 使用自定義組件 178
7.4 小結(jié)與練習(xí) 179
第 8 章 界面相關(guān)接口與動(dòng)畫(huà) 180
8.1 界面交互相關(guān)API的使用 180
8.1.1 關(guān)于Toast與Loading組件 181
8.1.2 可交互的用戶彈窗和抽屜功能接口 182
8.2 頁(yè)面尺寸控制與自定義字體 185
8.2.1 調(diào)整小程序頁(yè)面尺寸 185
8.2.2 在小程序中使用自定義字體 186
8.3 頁(yè)面滾動(dòng)與下拉刷新相關(guān)接口 187
8.3.1 通過(guò)API接口使頁(yè)面滾動(dòng)到指定的位置 187
8.3.2 下拉刷新相關(guān)接口 189
8.4 在小程序中使用動(dòng)畫(huà) 190
8.4.1 使用WXSS實(shí)現(xiàn)動(dòng)畫(huà)效果 190
8.4.2 使用小程序框架接口創(chuàng)建動(dòng)畫(huà)效果 192
8.4.3 交互式動(dòng)畫(huà) 194
8.5 小結(jié)與練習(xí) 195
第 9 章 網(wǎng)絡(luò)與數(shù)據(jù)存儲(chǔ) 197
9.1 在小程序中進(jìn)行網(wǎng)絡(luò)數(shù)據(jù)請(qǐng)求 197
9.1.1 申請(qǐng)接口服務(wù) 198
9.1.2 在小程序中調(diào)用天氣預(yù)報(bào)API服務(wù) 200
9.1.3 請(qǐng)求方法詳解 203
9.1.4 關(guān)于RequestTask對(duì)象 205
9.2 文件下載與上傳 206
9.2.1 小程序的文件系統(tǒng) 207
9.2.2 文件下載與上傳接口 207
9.3 在小程序中使用WebSocket技術(shù) 210
9.3.1 編寫(xiě)一個(gè)簡(jiǎn)易的WebSocket服務(wù)端 210
9.3.2 編寫(xiě)WebSocket客戶端示例程序 211
9.3.3 WebSocket相關(guān)接口詳解 212
9.4 小程序文件系統(tǒng) 214
9.4.1 以wx開(kāi)頭的文件系統(tǒng)接口 214
9.4.2 FileSystemManager文件管理器 216
9.5 小程序緩存工具 224
9.6 動(dòng)手練習(xí)：開(kāi)發(fā)一個(gè)移動(dòng)記事本小程序 226
9.6.1 開(kāi)發(fā)應(yīng)用主頁(yè) 226
9.6.2 “新建記事”頁(yè)面的開(kāi)發(fā) 227
9.6.3 “我的記事”頁(yè)面的開(kāi)發(fā) 229
9.7 小結(jié)與練習(xí) 231
第 10 章 常用功能接口 232
10.1 系統(tǒng)設(shè)置信息與應(yīng)用級(jí)事件相關(guān)接口 232
10.2 調(diào)試與性能相關(guān)接口 237
10.3 小程序中的轉(zhuǎn)發(fā)相關(guān)接口 242
10.4 用戶登錄與功能授權(quán) 245
10.5 小結(jié)與練習(xí) 248
第 11 章 云開(kāi)發(fā)技術(shù) 249
11.1 云開(kāi)發(fā)基礎(chǔ) 249
11.2 使用云數(shù)據(jù)庫(kù) 252
11.3 使用云存儲(chǔ) 262
11.4 使用云函數(shù) 265
11.5 實(shí)戰(zhàn)：使用云開(kāi)發(fā)技術(shù)改造移動(dòng)記事本應(yīng)用 274
11.6 小結(jié)與練習(xí) 277
第 12 章 項(xiàng)目實(shí)戰(zhàn)：天氣預(yù)報(bào)小程序的開(kāi)發(fā) 278
12.1 數(shù)據(jù)準(zhǔn)備 278
12.2 城市選擇模塊開(kāi)發(fā) 281
12.3 當(dāng)日天氣模塊開(kāi)發(fā) 285
12.4 最近7天天氣模塊開(kāi)發(fā) 287
12.5 生活指數(shù)模塊開(kāi)發(fā) 290
第 13 章 項(xiàng)目實(shí)戰(zhàn)：迷你商城小程序的開(kāi)發(fā) 292
13.1 電商應(yīng)用首頁(yè)開(kāi)發(fā) 292
13.2 分類(lèi)模塊開(kāi)發(fā) 308
13.3 商品列表與商品詳情頁(yè)開(kāi)發(fā) 312
13.4 加入購(gòu)物車(chē)與創(chuàng)建訂單功能開(kāi)發(fā) 317
13.5 “我的”頁(yè)面的開(kāi)發(fā) 326