微信小程序開發(fā)

目錄 CONTENTS

第 1章
初識微信小程序 1
1．1 微信小程序開發(fā) 1
1．1．1　什么是微信小程序 1
1．1．2　微信小程序的前景 2
1．1．3　開發(fā)小程序需要的技術 3
1．2　搭建開發(fā)環(huán)境 4
1．2．1　個人開發(fā)者申請微信公眾平臺賬號 4
1．2．2　搭建開發(fā)環(huán)境 5
1．2．3　配置程序 5
1．3　微信開發(fā)者工具 7
1．4　案例：第 一個Hello WX小程序 12
1．4．1　任務1——微信小程序創(chuàng)建 13
1．4．2　任務2——微信小程序架構分析 13
1．4．3　任務3——配置文件詳解 14
1．5　小　結 15
1．6　課后習題 15
第 2章
記事本小程序 18
2．1 邏輯層 18
2．1．1　注冊程序 19
2．1．2　注冊頁面 20
2．1．3　頁面路由 21
2．1．4　生命周期 22
2．1．5　模塊化 24
2．2　視圖層 25
2．2．1　HTML與WXML 25
2．2．2　CSS與WXSS 25
2．2．3　頁面事件 25
2．2．4　頁面的樣式 28
2．3　WXML語法 28
2．3．1　數(shù)據(jù)綁定 28
2．3．2　條件渲染 29
2．3．3　列表渲染 29
2．4　WXS語法 29
2．4．1　模塊 30
2．4．2　變量 31
2．4．3　運算符 31
2．4．4　控制語句 35
2．4．5　數(shù)據(jù)類型 38
2．5　Flex布局 38
2．5．1　基本概念 38
2．5．2　容器屬性 39
2．6　案例：記事本小程序 41
2．6．1　案例分析 41
2．6．2　任務1——首頁的實現(xiàn) 42
2．6．3　任務2——編輯頁面的實現(xiàn) 45
2．7　小　結 48
2．8　課后習題 48
第3章
校園新聞網(wǎng)小程序 50
3．1 視圖與基礎組件 50
3．1．1　視圖容器（view）組件 50
3．1．2　滾動視圖（scroll-view）組件 53
3．1．3　滑塊視圖容器（swiper）組件 55
3．1．4　圖標（icon）組件 57
3．1．5　文本（text）組件 59
3．1．6　進度條（progress）組件 60
3．1．7　導航（navigator）組件 62
3．2　案例：校園新聞網(wǎng)小程序 63
3．2．1　案例分析 63
3．2．2　任務1——導航欄 64
3．2．3　任務2——分類欄 64
3．2．4　任務3——輪播圖 65
3．2．5　任務4——新聞列表 66
3．2．6　任務5——回到頂部 68
3．3　小　結 69
3．4　課后習題 70
第4章
快遞單小程序 72
4．1 表單組件 72
4．1．1　按鈕（button）組件 72
4．1．2　多選框（checkbox）組件 74
4．1．3　表單（form）組件 75
4．1．4　輸入框（input）組件 76
4．1．5　滾動選擇器（picker）組件 77
4．1．6　單選控制器（radio）組件 80
4．1．7　滑動選擇器（slider）組件 81
4．1．8　開關選擇器（switch）組件 83
4．1．9　文本框（textarea）組件 84
4．2　案例：快遞單小程序 85
4．2．1　案例分析 85
4．2．2　任務1——導航欄 86
4．2．3　任務2——寄件人信息 87
4．2．4　任務3——收件人信息 90
4．2．5　任務4——立即下單 92
4．3　小　結 93
4．4　課后習題 93
第5章
邀請函小程序 95
5．1 媒體組件 95
5．1．1　圖片（image）組件 95
5．1．2　音頻（audio）組件 97
5．1．3　視頻（video）組件 100
5．2　地圖與動畫 102
5．2．1　地圖（map）組件 102
5．2．2　動畫（animation）對象 104
5．3　案例：邀請函小程序 106
5．3．1　案例分析 106
5．3．2　任務1——新建一個微信小程序并配置 107
5．3．3　任務2——制作邀請函頁面 109
5．3．4　任務3——制作照片展示頁面 111
5．3．5　任務4——制作視頻頁面 112
5．3．6　任務5——制作地圖頁面 113
5．3．7　任務6——制作社員信息提交頁面 114
5．3．8　任務7——添加心跳動畫 119
5．4　小　結 120
5．5　課后習題 120
第6章
文件管理小程序 122
6．1 文　件 122
6．1．1　文件系統(tǒng) 122
6．1．2　獲取文件信息 126
6．1．3　獲取本地文件列表 127
6．1．4　創(chuàng)建目錄 127
6．1．5　刪除目錄 128
6．1．6　打開文件 129
6．2　案例：文件管理小程序 129
6．2．1　案例分析 129
6．2．2　任務1——頁面的實現(xiàn) 130
6．2．3　任務2——目錄功能的實現(xiàn) 131
6．2．4　任務3——文件功能的實現(xiàn) 133
6．3　小　結 136
6．4　課后習題 136
第7章
你畫我猜小程序 138
7．1 畫　布 138
7．1．1　畫布基礎知識 138
7．1．2　畫布小程序 139
7．2　案例：你畫我猜小程序 140
7．2．1　案例分析 140
7．2．2　任務1——頁面結構 140
7．2．3　任務2——繪制圖像 141
7．2．4　任務3——選擇畫筆顏色 142
7．2．5　任務4——取消、擦除、刪除 143
7．2．6　任務5——分享圖片 144
7．3　小　結 145
7．4　課后習題 146
第8章
校園場地預約小程序 147
8．1 網(wǎng)　絡 147
8．1．1　小程序網(wǎng)絡基礎 147
8．1．2　上傳與下載 150
8．2　開放接口 154
8．2．1　登錄 154
8．2．2　用戶信息 157
8．2．3　賬號信息 159
8．2．4　授權 160
8．3　案例：校園場地預約小程序 161
8．3．1　案例分析 161
8．3．2　任務1——用戶授權 161
8．3．3　任務2——預約場地 164
8．4　小　結 164
8．5　課后習題 165
第9章
購物車小程序 166
9．1 開發(fā)模式對比 166
9．1．1　傳統(tǒng)開發(fā)模式 166
9．1．2　云開發(fā)模式 167
9．2　云開發(fā)基礎 168
9．2．1　開通云開發(fā) 168
9．2．2　云數(shù)據(jù)庫 169
9．2．3　云存儲 176
9．2．4　云函數(shù) 177
9．3　案例：奶茶購物車小程序 180
9．3．1　案例分析 180
9．3．2　任務1——創(chuàng)建項目并配置 181
9．3．3　任務2——商品展示頁的實現(xiàn) 182
9．3．4　任務3——購物車頁面的實現(xiàn) 185
9．3．5　任務4——結算頁面的實現(xiàn) 190
9．3．6　任務5——地址管理頁面的實現(xiàn) 193
9．3．7　任務6——新增地址頁面的實現(xiàn) 195
9．4　小　結 198
9．5　課后習題 198
第 10章
書城小程序 200
10．1 uni-app框架介紹 200
10．1．1　什么是uni-app 200
10．1．2　跨平臺開發(fā) 201
10．2　uni-app框架基礎 201
10．2．1　創(chuàng)建uni-app項目 201
10．2．2　目錄結構 202
10．2．3　語法規(guī)范 208
10．2．4　生命周期 217
10．3　uni-app常用API 220
10．3．1　頁面跳轉(zhuǎn) 220
10．3．2　發(fā)起請求 224
10．4　案例：書城小程序 227
10．4．1　案例分析 227
10．4．2　任務1——創(chuàng)建項目并配置導航欄 228
10．4．3　任務2——書城首頁的實現(xiàn) 230
10．4．4　任務3——分類頁面的實現(xiàn) 234
10．4．5　任務4——分類書籍列表頁面 236
10．4．6　任務5——書籍詳情頁面 237
10．4．7　任務6——書架頁面展示已添加的書籍 239
10．4．8　任務7——閱讀頁面 240
10．4．9　任務8——個人頁面 243
10．5　小　結 244
10．6　課后習題 244