構建移動網站與APP : ionic移動開發入門與實戰

構建移動網站與APP : ionic移動開發入門與實戰

《構建移動網站與APP : ionic移動開發入門與實戰》是2017年3月1日清華大學出版社出版的圖書,作者是秦超。

基本介紹

  • 書名:構建移動網站與APP : ionic移動開發入門與實戰
  • 作者:秦超
  • 出版社:清華大學出版社
  • ISBN:9787302462019
內容簡介,圖書目錄,

內容簡介

Ionic是目前集流行與成熟兩個特點於一身的跨平台移動開發框架。本書以實例驅動講解的方式,讓僅有簡單網頁製作基礎知識的讀者,也能輕鬆掌握Ionic下的移動套用開發。
本書分為5篇,第1篇是移動開發準備篇,介紹了Ionic、Phonegap、Cordova、HTML5和移動開發的一些基礎知識;第2篇是Ionic基礎知識準備與常用庫篇,介紹了配置開發Ionic環境所依賴的AngularJS、SASS、Gulp、lodash等業內主流庫和工具;第3篇是Ionic組件完全解析篇,對Ionic內置的CSS樣式類和JavaScript組件類進行完整解析;第4篇是APP項目實戰篇,介紹了如何按照業內通行實踐的策劃、設計、開發過程完成2個使用Ionic開發的完整APP。第5篇是發布和推廣套用篇,介紹了在開發完成之後,如何為Android和iOS兩大移動平台發布和推廣更新自己的APP。
本書內容詳盡、實例豐富,是廣大HTML 5愛好者、移動網際網路創業者、移動開發人員必備的參考書,同時也非常適合大中專院校師生學習閱讀,也可作為高等院校計算機及相關專業教材。

圖書目錄

第1章 歡迎進入移動開發的世界 1
1.1 移動網際網路行業的浪潮 1
1.2 跨平台移動開發框架 2
1.2.1 什麼是跨平台移動開發框架 2
1.2.2 為什麼選擇跨平台移動開發框架 3
1.2.3 可選的跨平台移動開發框架簡介 4
1.2.4 什麼是PhoneGap / Cordova / Ionic 8
1.3 初識Ionic v1.x 8
1.3.1 為什麼選擇Ionic 9
1.3.2 基於Web技術HTML 5/CSS 3/JavaScript 10
1.3.3 基於AngularJS框架 11
1.3.4 接近原生APP套用的炫麗界面組件 11
1.3.5 自適應(Responsive)布局 12
1.3.6 支持個(任)性定製 13
1.3.7 Ionic的缺點 13
1.3.8 Ionic的商業案例 14
1.3.9 Ionic的開源案例 15
1.3.10 Ionic的未來——Ionic v2.0 & AngularJS v2.0 16
1.4 學習完本書找工作與創業 17
1.4.1 從本書的項目實戰開始準備技術作品 17
1.4.2 Ionic 助力實現你的創業夢想 18
1.5 小結 18
第2章 Ionic 的開發調試環境安裝 19
2.1 Ionic 快速上手環境安裝 19
2.1.1 安裝Node.js和NPM 19
2.1.2 安裝Git 21
2.1.3 安裝Gulp和Bower 23
2.1.4 安裝Ionic CLI與Cordova 24
2.1.5 安裝設定Chrome瀏覽器(推薦) 25
2.1.6 Hello Ionic項目 27
2.1.7 使用瀏覽器驗證開發環境自動重載特性 28
2.2 Windows下安裝Android開發平台 29
2.2.1 安裝Android開發環境 29
2.2.2 為測試項目增加Android平台支持 34
2.2.3 連線Android實體機設備測試APP 34
2.2.4 不使用Android模擬器的說明 36
2.3 Apple OS X下安裝iOS與Android 開發平台 36
2.3.1 安裝Xcode 37
2.3.2 為測試項目增加iOS平台支持 37
2.3.3 連線iOS模擬器測試APP 37
2.3.4 低成本連線iOS實體機設備測試APP 38
2.3.5 安裝Android開發環境 40
2.3.6 為測試項目增加Android平台支持 45
2.3.7 連線Android實體機設備測試APP 45
2.4 安裝開發工具Sublime Text 3(推薦) 47
2.4.1 安裝開發工具Sublime Text 3 47
2.4.2 安裝Ionic輔助編碼外掛程式 48
2.5 小結 49
第3章 AngularJS v1.x入門初步 50
3.1 AngularJS整體結構概述 50
3.1.1 AngularJS實現了M.V.VM模式 51
3.1.2 AngularJS為JavaScript實現了模組化 52
3.1.3 AngularJS實現了聲明式界面 52
3.1.4 AngularJS實現了雙向數據綁定 52
3.2 代碼模組與依賴注入 54
3.2.1 定義模組與組件 54
3.2.2 使用模組與組件依賴注入 55
3.2.3 AngularJS模組與JavaScript檔案 56
3.3 數據作用域與控制器 56
3.3.1 在控制器內初始化作用域對象 56
3.3.2 使用作用域對象 57
3.3.3 控制器與作用域的反模式 59
3.4 指令和過濾器 59
3.4.1 指令Directive是什麼 60
3.4.2 自定義指令及使用 60
3.4.3 使用過濾器Filter 62
3.5 服務類組件 63
3.5.1 Provider服務組件詳解 64
3.5.2 Factory服務組件詳解 65
3.5.3 Service服務組件簡介 66
3.5.4 服務類組件特性總結 67
3.6 一個簡單的AngularJS項目:實時自選股行情頁 67
3.7 小結 76
第4章 其他基礎知識與Ionic項目結構 77
4.1 SASS 入門 77
4.1.1 變數與計算 78
4.1.2 樣式嵌套 79
4.1.3 單行注釋 // 81
4.1.4 繼承@extend 82
4.1.5 混入@mixin與@include 83
4.1.6 顏色計算 85
4.1.7 引入檔案@import 86
4.1.8 條件語句@if和@else 87
4.2 lodash(可選學) 87
4.2.1 使用場景 87
4.2.2 引入到項目 88
4.2.3 進一步學習指南 88
4.3 Gulp使用簡介(可選學) 89
4.3.1 Gulp主檔案gulpfile.js的執行原理 89
4.3.2 獲取流函式src 90
4.3.3 寫檔案函式dest 91
4.3.4 監視檔案變化函式watch 92
4.3.5 定義任務函式task 93
4.3.6 解析Ionic項目Gulp主檔案 94
4.4 Ionic項目模板目錄結構簡介 95
4.4.1 常用工作目錄 www 96
4.4.2 常用工作目錄scss 96
4.4.3 常用工作目錄 resources 97
4.4.4 重要檔案package.json 97
4.4.5 重要檔案config.xml 97
4.4.6 其他目錄與檔案簡介 98
4.5 小結 98
第5章 Ionic內置CSS樣式 99
5.1 柵格布局解析 100
5.1.1 基本行與列CSS類 101
5.1.2 指定列寬比例與自定義 102
5.1.3 指定列相對偏移比例 105
5.1.4 縱軸對齊方式 107
5.1.5 回響式柵格 109
5.1.6 示例:表情包圖片庫瀏覽頁 111
5.2 固定標題欄 113
5.2.1 固定標題條 114
5.2.2 固定頂欄 114
5.2.3 固定底欄 115
5.3 按鈕 116
5.3.1 普通按鈕與配色結合 116
5.3.2 按鈕尺寸、寬度樣式 118
5.3.3 無填充色按鈕與文本型按鈕 119
5.3.4 圖示按鈕 120
5.3.5 標題欄按鈕 121
5.3.6 按鈕條 123
5.4 列表容器 124
5.4.1 分割條式列表項 125
5.4.2 列表項內圖示 126
5.4.3 列表項內按鈕 127
5.4.4 列表項內頭像 128
5.4.5 列表項內縮略預覽圖 129
5.4.6 有邊距的列表 130
5.5 展示卡 131
5.5.1 普通卡 132
5.5.2 增加標題欄裝飾效果 133
5.5.3 卡列表 134
5.5.4 卡內圖片 134
5.5.5 Facebook型展示卡 135
5.6 表單控制項樣式 137
5.6.1 輸入欄位名提示 137
5.6.2 輸入控制項圖示 140
5.6.3 有邊距的輸入表單 141
5.6.4 輸入控制項單獨設定邊距 141
5.6.5 標題欄上放置文本輸入控制項 142
5.7 開關類組件 142
5.8 範圍選擇組件 144
5.9 選擇框組件 145
5.10 選項卡欄 146
5.10.1 普通文本型選項卡 147
5.10.2 圖示型選項卡 148
5.10.3 圖示置頂或置左型選項卡 149
5.10.4 選項卡指示條 151
5.11 自定義主題顏色 152
5.12 可用圖示集 154
5.13 內邊距微調 155
5.14 小結 155
第6章 Ionic內置JS組件概述 156
6.1 Ionic內置JS組件 156
6.1.1 組件分類與前後綴說明 156
6.1.2 Ionic內置JS組件與CSS樣式類集成 157
6.1.3 Ionic內置JS組件與AngularJS 集成 157
6.2 使用JS組件的常見問題解決辦法 158
6.2.1 互動調試部署到Android設備上的Ionic套用 158
6.2.2 設備上顯示白螢幕錯誤問題調試 159
6.2.3 使用Batarang進行性能分析 160
6.3 小結 161
第7章 Ionic內置布局類組件 162
7.1 固定標題欄 162
7.2 內容顯示相關組件 164
7.2.1 內容展示容器 164
7.2.2 內容滾動容器 167
7.2.3 內容容器對象滾動服務 169
7.2.4 載入新內容滾動觸發器 169
7.2.5 下拉刷新組件 171
7.3 小結 173
第8章 Ionic內置導航類組件 174
8.1 導航框架相關組件 175
8.1.1 導航視圖容器與視圖 175
8.1.2 定製頂部導航欄 179
8.1.3 瀏覽歷史服務 182
8.2 選項卡相關組件 183
8.2.1 選項卡欄與選項卡 183
8.2.2 選項卡服務 188
8.3 側欄選單相關組件 189
8.3.1 側欄選單框架 189
8.3.2 側欄選單顯示設定 194
8.3.3 側欄選單服務 194
8.4 導航套用綜合實戰:個人電子簡歷APP框架 195
8.5 小結 201
第9章 Ionic內置數據展示與操作組件 202
9.1 列表相關組件 202
9.1.1 列表容器與列表項定製 202
9.1.2 列表服務 205
9.1.3 列表高性能顯示最佳化 206
9.2 表單輸入相關組件 208
9.3 對話框類相關組件 209
9.3.1 模態框 209
9.3.2 浮動框 211
9.3.3 彈出框 213
9.3.4 上拉選單 216
9.3.5 背景幕布 218
9.3.6 對話框類組件綜合示例 218
9.4 載入中提示相關組件 226
9.4.1 載入中指示器 226
9.4.2 載入中指示服務 227
9.5 輪播組件 229
9.6 手勢事件與服務組件 232
9.6.1 Ionic手勢事件類型 232
9.6.2 手勢事件 232
9.7 鍵盤組件 233
9.7.1 鍵盤外掛程式 233
9.7.2 懸浮底欄指令 234
9.8 小結 234
第10章 Ionic內置基礎服務組件與設備平台客制化 235
10.1 平台服務組件 235
10.2 其他工具 237
10.2.1 套用基礎配置 237
10.2.2 設備信息與基本操作 238
10.2.3 DOM信息與基本操作 240
10.2.4 DOM元素位置信息 240
10.2.5 事件管理 241
10.3 設備平台客制化 242
10.3.1 設備平台CSS樣式類 242
10.3.2 使用AngularJS客制化平颱風格示例 244
10.4 小結 246
第11章 藉助外掛程式接近無限可能 247
11.1 Cordova外掛程式 247
11.1.1 搜尋可用的外掛程式 247
11.1.2 外掛程式管理(安裝、刪除、顯示已裝外掛程式) 248
11.1.3 cordova-plugin-battery-status外掛程式使用示例 249
11.1.4 cordova-plugin-whitelist外掛程式說明 251
11.2 ngCordova外掛程式集 253
11.2.1 安裝ngCordova外掛程式集 253
11.2.2 ngCordova外掛程式使用步驟概要 254
11.2.3 外掛程式$cordovaDevice使用示例 257
11.2.4 外掛程式$cordovaToast使用示例 258
11.2.5 外掛程式$cordovaContacts使用示例 259
11.2.6 外掛程式$cordovaLocalNotification使用示例 260
11.2.7 外掛程式$cordovaGeolocation使用示例 260
11.2.8 外掛程式$cordovaVibration使用示例 262
11.2.9 外掛程式$cordovaCamera使用示例 262
11.2.10 外掛程式$cordovaSocialSharing使用示例 264
11.2.11 外掛程式$cordovaNetwork使用示例 265
11.2.12 外掛程式$cordovaSQLite使用示例 266
11.3 小結 267
第12章 後端伺服器模擬環境搭建準備 268
12.1 MongoDB安裝與測試 268
12.2 Postman安裝與使用示例 271
12.3 使用Express初始化創建API示例 274
12.4 使用Mongoose完善數據持久化示例 282
12.5 使用Passport加入用戶驗證示例 287
12.6 小結 296
第13章 項目實戰:逍遙遊APP v0.1(UGC+B2C套用) 297
13.1 項目和代碼說明 297
13.1.1 項目說明 297
13.1.2 隨書代碼運行說明 298
13.2 功能設計 298
13.2.1 界面與功能概述 300
13.2.2 服務端API接口概述 303
13.3 功能實現 303
13.3.1 準備工作:部署伺服器端環境 304
13.3.2 初始化項目設定與目錄結構 305
13.3.3 實現總體界面導航與路由 306
13.3.4 實現側欄選單功能集 312
13.3.5 實現旅友行蹤功能集 321
13.3.6 實現我的足跡功能集 332
13.3.7 實現預約旅遊產品功能集 351
13.3.8 實現設定功能集 363
13.3.9 定製啟動屏與APP圖示 371
13.4 小結與作業練習 371
第14章 項目實戰:銷售掌中寶v0.1 (企業套用) 373
14.1 項目和代碼說明 373
14.1.1 項目說明 374
14.1.2 隨書代碼運行說明 374
14.2 功能設計 375
14.2.1 界面與業務功能概述 375
14.2.2 服務端API接口概述 378
14.3 功能實現 379
14.3.1 準備工作:部署伺服器端環境 379
14.3.2 初始化項目設定與目錄結構 381
14.3.3 完成總體界面導航與路由 382
14.3.4 實現側欄選單與登錄/退出功能 387
14.3.5 實現商機業務功能集 391
14.3.6 實現拜訪業務功能集 404
14.3.7 實現客戶業務功能集 420
14.3.8 實現訂單業務功能集 434
14.3.9 實現報表顯示與初步配置 446
14.4 小結與作業練習 455
第15章 套用的生成與發布更新 456
15.1 生成發布Android平台的套用包 456
15.1.1 生成發布版的apk檔案 456
15.1.2 生成用於簽名的私鑰 457
15.1.3 對apk檔案簽名 457
15.1.4 最佳化apk檔案並改名 458
15.1.5 發布Android套用 459
15.2 生成發布iOS平台的套用 459
15.2.1 使用開發者賬戶連線Xcode 460
15.2.2 簽名 460
15.2.3 設定套用的標識名 461
15.2.4 開始套用上架登記 462
15.2.5 嘗試編譯生成正式發布版的套用 465
15.2.6 使用Xcode打包APP套用 465
15.2.7 創建套用的發布檔 466
15.2.8 完成套用上架登記 467
15.3 更新套用 470
15.4 小結 471

相關詞條

熱門詞條

聯絡我們