HTML5混合App開(kāi)發(fā)

目錄

第1章混合App開(kāi)發(fā)簡(jiǎn)介1
【教學(xué)導(dǎo)航】1
1.1什么是混合App開(kāi)發(fā)1
1.1.1移動(dòng)App開(kāi)發(fā)的三種模式1
1.1.2混合App開(kāi)發(fā)應(yīng)用場(chǎng)景3
1.2混合App開(kāi)發(fā)應(yīng)用技術(shù)4
1.2.1MVC與MVVM架構(gòu)模式4
1.2.2AngularJS簡(jiǎn)介6
1.2.3Cordova簡(jiǎn)介8
1.2.4ionic簡(jiǎn)介9
1.3本章小結(jié)10
第2章初識(shí)AngularJS11
【教學(xué)導(dǎo)航】11
2.1快速體驗(yàn)AngularJS11
2.1.1AngularJS1與AngularJS2
的區(qū)別11
2.1.2AngularJS的環(huán)境配置12
2.1.3第一個(gè)AngularJS程序13
2.2AngularJS的基本概念16
2.2.1AngularJS的模塊與
控制器16
2.2.2AngularJS作用域20
2.2.3AngularJS表達(dá)式24
2.2.4AngularJS的指令27
2.2.5自動(dòng)化雙向綁定28
2.3本章小結(jié)29
第3章AngularJS的指令30
【教學(xué)導(dǎo)航】30目錄HTML5混合App開(kāi)發(fā)3.1指令的分類(lèi)30
3.2AngularJS常用的內(nèi)置指令31
3.2.1程序控制和數(shù)據(jù)綁定類(lèi)指令31
3.2.2狀態(tài)設(shè)置類(lèi)指令33
3.2.3事件綁定類(lèi)指令39
3.2.4訪(fǎng)問(wèn)流程類(lèi)指令42
3.2.5加載處理類(lèi)指令49
3.3AngularJS的自定義指令50
3.3.1directive()函數(shù)51
3.3.2自定義指令的約束53
3.3.3指令的作用域54
3.4本章小結(jié)58
第4章AngularJS相關(guān)原理59
【教學(xué)導(dǎo)航】59
4.1AngularJS與MVVM59
4.2AngularJS的啟動(dòng)流程60
4.3臟檢查機(jī)制62
4.3.1臟檢查機(jī)制的實(shí)現(xiàn)原理62
4.3.2$watch函數(shù)66
4.3.3$apply函數(shù)67
4.4AngularJS與依賴(lài)注入68
4.4.1什么是依賴(lài)注入69
4.4.2JavaScript如何實(shí)現(xiàn)依賴(lài)注入70
4.4.3AngularJS中的依賴(lài)注入72
4.5本章小結(jié)74
第5章AngularJS的服務(wù)75
【教學(xué)導(dǎo)航】75
5.1AngularJS創(chuàng)建服務(wù)75
5.1.1使用provider()函數(shù)創(chuàng)建服務(wù)76
5.1.2使用factory()函數(shù)創(chuàng)建服務(wù)79
5.1.3使用service()函數(shù)創(chuàng)建服務(wù)80
5.1.4使用value()和constant()函數(shù)創(chuàng)建服務(wù)83
5.2AngularJS內(nèi)置服務(wù)85
5.2.1訪(fǎng)問(wèn)JavaScript全局對(duì)象85
5.2.2AngularJS路由91
5.2.3AngularJS中的Ajax訪(fǎng)問(wèn)95
5.3本章小結(jié)98
第6章AngularJS框架項(xiàng)目實(shí)戰(zhàn)99
6.1項(xiàng)目實(shí)戰(zhàn)——邀請(qǐng)名單99
6.1.1項(xiàng)目展示99
6.1.2項(xiàng)目分析101
6.1.3項(xiàng)目目錄和文件結(jié)構(gòu)103
6.1.4封裝對(duì)象模型104
6.1.5編寫(xiě)業(yè)務(wù)邏輯106
6.1.6編寫(xiě)靜態(tài)頁(yè)面107
6.1.7添加數(shù)據(jù)綁定110
6.2項(xiàng)目實(shí)戰(zhàn)——電影列表111
6.2.1項(xiàng)目展示111
6.2.2項(xiàng)目分析113
6.2.3項(xiàng)目目錄和文件結(jié)構(gòu)115
6.2.4接口API測(cè)試116
6.2.5搭建項(xiàng)目并封裝自定義的JSONP服務(wù)117
6.2.6封裝和測(cè)試數(shù)據(jù)對(duì)象模型119
6.2.7編寫(xiě)電影列表頁(yè)面的控制器和模板122
6.2.8編寫(xiě)電影詳情頁(yè)面的控制器和模板125
6.2.9完成路由功能并整合項(xiàng)目126
6.3本章小結(jié)128
第7章ionic開(kāi)發(fā)環(huán)境的安裝與配置129
【教學(xué)導(dǎo)航】129
7.1安裝Android SDK129
7.1.1JDK的下載和安裝129
7.1.2Android SDK的下載和安裝135
7.2安裝Node.js142
7.2.1Node.js和NPM簡(jiǎn)介142
7.2.2Node.js的下載和安裝142
7.3安裝Git146
7.4安裝ionic和Cordova150
7.4.1ionic1與ionic2的區(qū)別150
7.4.2ionic和Cordova的安裝150
7.5本章小結(jié)151
第8章快速體驗(yàn)ionic項(xiàng)目152
【教學(xué)導(dǎo)航】152
8.1快速創(chuàng)建ionic項(xiàng)目152
8.1.1ionic的3種項(xiàng)目模板152
8.1.2下載項(xiàng)目模板153
8.1.3為項(xiàng)目添加Android平臺(tái)支持155
8.1.4打包Android APK157
8.2ionic項(xiàng)目目錄和文件結(jié)構(gòu)159
8.2.1常用工作目錄和重要文件159
8.2.2其他工作目錄和文件163
8.3定制項(xiàng)目圖標(biāo)和啟動(dòng)頁(yè)165
8.4本章小結(jié)168
第9章ionic CSS169
【教學(xué)導(dǎo)航】169
9.1基本布局類(lèi)樣式169
9.1.1手機(jī)App常用布局方式169
9.1.2定高條塊170
9.1.3內(nèi)容區(qū)域175
9.2顏色和圖標(biāo)類(lèi)樣式177
9.2.1顏色177
9.2.2圖標(biāo)179
9.3界面組件類(lèi)樣式181
9.3.1按鈕181
9.3.2列表185
9.3.3卡片191
9.3.4表單輸入192
9.3.5選項(xiàng)卡200
9.4柵格系統(tǒng)類(lèi)樣式204
9.4.1基本行與列204
9.4.2指定列寬205
9.4.3指定列偏移206
9.4.4列表縱向?qū)R207
9.4.5響應(yīng)式柵格209
9.5本章小結(jié)210
第10章ionic JavaScript(上)212
【教學(xué)導(dǎo)航】212
10.1ionic JavaScript概述212
10.1.1ionic指令式組件212
10.1.2ionic服務(wù)式組件213
10.2基本布局組件214
10.2.1固定標(biāo)題欄214
10.2.2內(nèi)容區(qū)域216
10.2.3滾動(dòng)條218
10.2.4滾動(dòng)刷新220
10.2.5下拉刷新223
10.2.6手動(dòng)控制滾動(dòng)視圖225
10.3ionic路由229
10.3.1路由狀態(tài)機(jī)229
10.3.2模板視圖與視圖容器230
10.3.3路由的實(shí)現(xiàn)230
10.4界面組件233
10.4.1頂部導(dǎo)航欄234
10.4.2列表237
10.4.3表單輸入241
10.4.4幻燈片243
10.4.5側(cè)邊欄菜單246
10.4.6選項(xiàng)卡251
10.5本章小結(jié)256
第11章ionic JavaScript(下)257
【教學(xué)導(dǎo)航】257
11.1動(dòng)態(tài)組件257
11.1.1模態(tài)對(duì)話(huà)框257
11.1.2上拉菜單262
11.1.3彈出框265
11.1.4浮動(dòng)框269
11.1.5背景幕273
11.1.6載入指示器275
11.2手勢(shì)事件277
11.2.1常用的手勢(shì)事件277
11.2.2手動(dòng)注冊(cè)與解除手勢(shì)事件278
11.3IndexedDB279
11.3.1IndexedDB簡(jiǎn)介279
11.3.2Object Store280
11.3.3請(qǐng)求的生命周期281
11.3.4IndexedDB的基本使用282
11.4本章小結(jié)289
第12章項(xiàng)目實(shí)戰(zhàn)——Mall App290
12.1項(xiàng)目簡(jiǎn)介290
12.1.1項(xiàng)目展示290
12.1.2項(xiàng)目目錄和文件結(jié)構(gòu)293
12.2任務(wù)1——項(xiàng)目結(jié)構(gòu)搭建295
12.2.1任務(wù)描述295
12.2.2任務(wù)分析295
12.2.3代碼實(shí)現(xiàn)296
12.3任務(wù)2——引導(dǎo)頁(yè)298
12.3.1任務(wù)描述298
12.3.2任務(wù)分析299
12.3.3代碼實(shí)現(xiàn)300
12.4任務(wù)3——導(dǎo)航標(biāo)簽307
12.4.1任務(wù)描述307
12.4.2任務(wù)分析307
12.4.3代碼實(shí)現(xiàn)307
12.5任務(wù)4——商城首頁(yè)310
12.5.1任務(wù)描述310
12.5.2任務(wù)分析310
12.5.3代碼實(shí)現(xiàn)311
12.6任務(wù)5——商品分類(lèi)323
12.6.1任務(wù)描述323
12.6.2任務(wù)分析324
12.6.3代碼實(shí)現(xiàn)324
12.7任務(wù)6——商品列表335
12.7.1任務(wù)描述335
12.7.2任務(wù)分析 335
12.7.3代碼實(shí)現(xiàn)336
12.8任務(wù)7——商品詳情347
12.8.1任務(wù)描述347
12.8.2任務(wù)分析347
12.8.3代碼實(shí)現(xiàn)349
12.9任務(wù)8——購(gòu)物車(chē)364
12.9.1任務(wù)描述364
12.9.2任務(wù)分析365
12.9.3代碼實(shí)現(xiàn)365
12.10任務(wù)9——個(gè)人中心379
12.10.1任務(wù)描述379
12.10.2任務(wù)分析379
12.10.3代碼實(shí)現(xiàn)380
12.11本章小結(jié)388