微信小程序開發(fā)入門精要

第1章　微信小程序入門　1 1.1　什么是微信小程序　1 1.2　原生熱布局　4 1.3　注冊(cè)小程序賬號(hào)　5 1.4　獲得AppID　6 1.5　設(shè)置小程序信息　7 1.6　開發(fā)第一個(gè)微信小程序　8 1.6.1　配置開發(fā)環(huán)境　8 1.6.2　建立小程序項(xiàng)目　10 1.6.3　猜拳游戲的布局　11 1.6.4　控制剪子、石頭、布的快速 切換　13 1.6.5　真機(jī)測(cè)試小程序　15 1.6.6　真機(jī)調(diào)試小程序　16 1.6.7　上傳和審核小程序　17 1.7　小結(jié)　18 第2章　布局　19 2.1　水平排列　19 2.2　水平折行排列　21 2.3　垂直排列　22 2.4　垂直折列排列　24 2.5　水平排列對(duì)齊方式　24 2.6　垂直排列對(duì)齊方式　25 2.7　水平等間隔排列　28 2.8　帶邊距的水平等間隔排列　29 2.9　小結(jié)　30 第3章　視圖容器　31 3.1　滾動(dòng)視圖（scroll-view）　31 3.1.1　垂直滾動(dòng)視圖　31 3.1.2　水平滾動(dòng)視圖　32 3.1.3　滾動(dòng)到邊緣觸發(fā)事件　34 3.1.4　滾動(dòng)事件　35 3.2　廣告輪詢圖視圖容器（swiper）　37 3.2.1　顯示水平和垂直滑動(dòng)的廣告 頁(yè)面　37 3.2.2　自動(dòng)切換廣告輪詢圖　39 3.2.3　響應(yīng)輪詢圖切換事件　40 3.3　小結(jié)　40 第4章　視圖層技術(shù)　41 4.1　條件渲染　41 4.2　列表渲染　43 4.2.1　wx:for-item　43 4.2.2　wx:for-index　44 4.2.3　block wx:for　44 4.2.4　嵌套循環(huán)　45 4.2.5　wx:key　46 4.3　模板　50 4.4　引用　53 4.4.1　import　53 4.4.2　include　54 4.5　小結(jié)　54 第5章　基礎(chǔ)組件　55 5.1　text組件　55 5.2　系統(tǒng)內(nèi)置圖標(biāo)組件（icon）　57 5.3　progress組件　58 5.4　小結(jié)　59 第6章　表單組件　60 6.1　按鈕組件（button）　60 6.2　復(fù)選框組件（checkbox）　63 6.3　文本輸入組件（input）　65 6.4　可與其他組件綁定的文本組件 （label）　68 6.5　單選組件（radio）　71 6.6　開關(guān)組件（switch）　73 6.7　滾動(dòng)組件（picker）　75 6.8　滑桿組件（slider）　77 6.9　多行輸入框組件（textarea）　79 6.10　form組件　80 6.11　小結(jié)　82 第7章　多媒體組件　83 7.1　image組件　83 7.2　audio組件　86 7.3　video組件　88 7.4　小結(jié)　91 第8章　其他組件　92 8.1　交互組件　92 8.1.1　動(dòng)作表單（ActionSheet）　92 8.1.2　對(duì)話框　95 8.2　畫布　96 8.3　地圖　98 8.4　導(dǎo)航　100 8.4.1　頁(yè)面導(dǎo)航　100 8.4.2　TabBar導(dǎo)航　103 8.5　小結(jié)　105 第9章　網(wǎng)絡(luò)　106 9.1　準(zhǔn)備工作（阿里云還是騰訊云）　106 9.2　發(fā)起HTTPS請(qǐng)求　109 9.3　上傳文件　111 9.4　下載文件　112 9.5　WebSocket　112 9.6　小結(jié)　115 第10章　多媒體　116 10.1　圖像　116 10.1.1　選擇圖像　116 10.1.2　預(yù)覽圖像　120 10.1.3　獲取圖像信息　121 10.2　音頻處理　122 10.2.1　錄音　123 10.2.2　播放、暫停、停止聲音　124 10.2.3　控制背景音樂(lè)　126 10.2.4　音頻組件控制　129 10.3　視頻處理　130 10.3.1　選擇視頻文件　131 10.3.2　視頻組件控制　131 10.4　小結(jié)　133 第11章　數(shù)據(jù)存取　134 11.1　文件管理　134 11.1.1　保存文件　134 11.1.2　獲取保存的文件列表　135 11.1.3　獲取文件信息　136 11.1.4　刪除永久文件　136 11.1.5　打開文檔　136 11.2　數(shù)據(jù)緩存　138 11.2.1　異步存取key-value值　138 11.2.2　同步存取key-value值　139 11.2.3　獲取key-value存儲(chǔ)信息　140 11.2.4　移除指定的key-value值　140 11.2.5　清除所有的key-value值　141 11.3　小結(jié)　141 第12章　位置　142 12.1　獲取經(jīng)緯度　142 12.2　在地圖上選中位置　143 12.3　用微信內(nèi)置的地圖顯示位置　144 12.4　與組件綁定　146 12.5　小結(jié)　147 第13章　設(shè)備　148 13.1　獲取系統(tǒng)信息　148 13.2　獲得網(wǎng)絡(luò)類型　150 13.3　獲取重力感應(yīng)數(shù)據(jù)　151 13.4　獲取羅盤方向　152 13.5　撥打電話　153 13.6　掃描二維碼　154 13.7　小結(jié)　155 第14章　界面　156 14.1　信息框　156 14.1.1　顯示Toast信息框　156 14.1.2　隱藏Toast信息框　157 14.1.3　顯示模態(tài)窗口　157 14.1.4　顯示操作菜單　158 14.2　導(dǎo)航　159 14.2.1　為導(dǎo)航條添加標(biāo)題　159 14.2.2　設(shè)置和隱藏導(dǎo)航條 　動(dòng)畫　160 14.2.3　導(dǎo)航與返回頁(yè)面　161 14.2.4　導(dǎo)航到指定頁(yè)面，并關(guān)閉當(dāng)前 　頁(yè)面　163 14.3　動(dòng)畫　163 14.4　繪圖　166 14.4.1　繪制基本圖形　166 14.4.2　繪制二次方貝塞爾曲線　167 14.4.3　繪制三次方貝塞爾曲線　168 14.4.4　陰影效果　170 14.4.5　繪制圖像　170 14.4.6　圖形的縮放　171 14.4.7　圖形的旋轉(zhuǎn)　171 14.4.8　改變坐標(biāo)原點(diǎn)　172 14.4.9　漸變　173 14.5　下拉刷新　174 14.6　小結(jié)　174 第15章　開放接口　175 15.1　微信登錄　175 15.1.1　獲取SessionKey　175 15.1.2　校驗(yàn)登錄是否過(guò)期　177 15.2　獲取用戶信息　178 15.3　微信支付　179 15.4　分享　181 15.5　小結(jié)　182 第16章　徽章（Badge）　183 16.1　新消息徽章　183 16.2　圖標(biāo)右上角顯示數(shù)字徽章　186 16.3　將數(shù)字徽章改成模板　186 16.4　文字右側(cè)顯示數(shù)字徽章　188 16.5　小結(jié)　189 第17章　基礎(chǔ)組件　190 17.1　頁(yè)腳（footer）　190 17.2　網(wǎng)格（grid）　192 17.3　裝載動(dòng)畫（loadmore）　193 17.4　列表組件（list）　194 17.5　單選列表項(xiàng)　196 17.6　復(fù)選列表項(xiàng)　197 17.7　小結(jié)　198 第18章　高仿計(jì)算器　199 18.1　項(xiàng)目概述　199 18.2　設(shè)計(jì)和實(shí)現(xiàn)按鈕模板　200 18.3　計(jì)算器UI布局　200 18.4　編寫計(jì)算器的邏輯代碼　205 18.5　小結(jié)　208 第19章　快遞查詢　209 19.1　項(xiàng)目概述　209 19.2　設(shè)計(jì)UI　210 19.3　編寫業(yè)務(wù)邏輯代碼　213 19.4　小結(jié)　215 第20章　電影訂票　216 20.1　項(xiàng)目概述　216 20.2　設(shè)計(jì)電影列表UI的布局　217 20.3　編寫電影列表的邏輯代碼　218 20.4　電影細(xì)節(jié)展示和訂票頁(yè)面UI布局　219 20.5　電影展示和訂票邏輯實(shí)現(xiàn)　221 20.6　小結(jié)　222 第21章　圖表　223 21.1　曲線圖　223 21.2　柱狀圖　225 21.3　餅狀圖　226 21.4　環(huán)形圖　228 21.5　面積圖　229 21.6　小結(jié)　231