Android移動網站開發詳解

利用HTML 5和主流JS框架打造掌上移動平台,jQuery Mobie和Phone Gap雙劍合璧。

內容介紹

《Android移動網站開發詳解》內容新穎、知識全面、講解詳細,分為4篇,共24章。其中,第1~3章是基礎篇,包括Android技術概述、Android網路開發技術基礎、創建移動Web的方法;第4~13章是HTML 5篇,講解了在Android中使用HTML 5技術設計移動Web網頁的基本知識,包括HTML 5架構、基本元素、表單元素、音頻處理、視頻處理、繪圖、數據存儲、常用API的基本知識和具體用法;第14~22章是jQuery Mobile篇,詳細講解了在Android中使用jQuery Mobile框架開發移動Web網頁的基本知識,包括jQuery Mobile導航、按鈕、表單、列表、內容格式化、主題化設計和常用API的基本知識和各個知識點的具體用法;第23~24章是綜合實戰篇,本篇結合前面3篇內容,講解了在PhoneGap框架中開發大型綜合移動Web系統的具體流程和方法。全書採用理論加實踐的教學方法,每個實例先提出製作思路及包含的知識點,然後力求用最通俗的語言將高深的知識闡述出來。通過本書的內容,讀者可以掌握在Android系統中開發移動Web的基本知識。
本書適合Android開發者、網頁設計師和Web開發程式設計師、研發人員及在職程式設計師閱讀,也可作為相關培訓學校和大中專院校相關專業的教學用書。

作者簡介

歸國博士,職稱教授,山東科技大學計算機學院計算機系主任,計算技術研究所副成員,碩士研究生導師

目錄

目 錄

第1 篇 基 礎 篇

第1 章 Android 技術概述...............................2

1.1 來到智慧型手機世界.....................................2

1.1.1 何謂智慧型手機.................................................. 2

1.1.2 當前主流的智慧型手機系統.............................. 3

1.2 蓬勃發展的手機上網產業.........................6

1.2.1 WAP 技術介紹................................................ 6

1.2.2 手機上網的商機.............................................. 7

1.2.3 移動平台套用開發.......................................... 7

1.3 Android 的巨大優勢...................................8

1.3.1 系出名門.......................................................... 8

1.3.2 強大的開發團隊.............................................. 8

1.3.3 誘人的獎勵機制.............................................. 9

1.3.4 開源................................................................ 10

1.4 搭建Android 套用開發環境....................10

1.4.1 安裝Android SDK 的系統要求.................... 10

1.4.2 安裝JDK、Eclipse、Android SDK .............. 11

1.4.3 設定Android SDK Home .............................. 19

1.4.4 驗證理論........................................................ 19

1.4.5 創建Android 虛擬設備(AVD)................. 21

1.4.6 啟動AVD 模擬器.......................................... 22

第2 章 Android 網路開發技術基礎...............25

2.1 HTML 簡介...............................................25

2.1.1 HTML 初步認識............................................ 25

2.1.2 字型格式設定................................................ 26

2.1.3 使用標示標記................................................ 28

2.1.4 使用區域和段落標記.................................... 29

2.1.5 使用表格標記................................................ 31

2.1.6 使用表單標記................................................ 33

2.2 XML 技術..................................................36

2.2.1 XML 的概述.................................................. 37

2.2.2 XML 的語法.................................................. 37

2.2.3 獲取XML 文檔............................................. 38

2.3 CSS 技術基礎...........................................39

2.3.1 基本語法........................................................ 40

2.3.2 CSS 屬性介紹................................................ 40

2.3.3 CSS 編碼規範................................................ 42

2.4 JavaScript 技術基礎..................................43

2.4.1 JavaScript 概述.............................................. 44

2.4.2 JavaScript 運算符........................................... 44

2.4.3 JavaScript 循環語句....................................... 46

2.4.4 JavaScript 函式.............................................. 48

2.4.5 JavaScript 事件.............................................. 49

2.4.6 常用的Web 頁面腳本................................... 51

2.5 在Android 設備測試網頁........................53

2.6 編寫第一個網頁.......................................56

2.6.1 編寫HTML 檔案........................................... 56

2.6.2 設定頁面的縮放............................................ 60

2.6.3 使用CSS 進行修飾....................................... 60

第3 章 創建移動Web ..................................64

3.1 創建能在通用設備上運行的網站...........64

3.1.1 確定應用程式類型........................................ 64

3.1.2 使用CSS 改善HTML 外觀.......................... 65

3.1.3 加入移動meta 標籤...................................... 67

3.1.4 最佳化網站........................................................ 68

3.2 將站點升級至HTML 5............................68

3.2.1 確定何時升級和升級的具體方式................ 68

3.2.2 升級到HTML 5 的步驟................................ 70

3.2.3 將HTML 5 特性作為額外內容添加至

網站................................................................ 70

3.2.4 HTML 5 為移動Web 提供的服務............... 71

3.3 將Web 程式遷移到移動設備..................71

3.3.1 選擇Web 編輯器........................................... 72

3.3.2 測試應用程式................................................ 72

3.3.3 移動網站內容的特點.................................... 73

3.3.4 為移動設備調整可視化設計........................ 73

3.3.5 HTML 5 及CSS 3 檢測................................. 74

第2 篇 HTML 5 篇

第4 章 HTML 5 在移動設備中......................78

4.1 把握未來的風向標...................................78

4.1.1 漫漫發展歷程................................................ 78

4.1.2 無與倫比的體驗............................................ 78

4.2 在Android 設備中使用HTML 5.............79

4.2.1 使用HTML 5 設計移動網站時需要考慮的

問題................................................................ 80

4.2.2 主流的移動設備螢幕的解析度..................... 80

4.2.3 使用標準的HTML、CSS 和JavaScript

技術................................................................ 81

4.3 用HTML 5 設計移動網站前的準備.......81

4.3.1 為移動網站準備專用的域名......................... 82

4.3.2 準備測試環境................................................ 82

第5 章 HTML 5 的整體架構.........................83

5.1 設定網頁頭部元素...................................83

5.1.1 設定文檔類型................................................ 83

5.1.2 設定所有連結規定默認地址或默認目標..... 84

5.1.3 連結標籤........................................................ 85

5.1.4 設定有關頁面的元信息................................ 86

5.1.5 定義客戶端腳本............................................ 87

5.1.6 定義HTML 文檔的樣式信息....................... 87

5.1.7 設定頁面標題................................................ 88

5.2 設定頁面正文...........................................89

5.3 注釋............................................................90

5.4 和頁面結構相關的新元素.......................91

5.4.1 定義區段的標籤............................................ 91

5.4.2 定義獨立內容的標籤.................................... 92

5.4.3 定義導航連結標籤........................................ 92

5.4.4 定義其所處內容之外的內容......................... 93

5.4.5 定義頁腳內容的標籤.................................... 94

第6 章 體驗基本元素...................................95

6.1 在頁面中輸出一段文字...........................95

6.2 對頁面進行分欄設計...............................96

6.3 使用<details>標記元素實現互動............97

6.3.1 常用屬性........................................................ 97

6.3.2 實現下拉彈出效果........................................ 98

6.4 使用<summary>標記元素實現互動........99

6.5 使用<menu>標記元素............................100

6.5.1 屬性介紹...................................................... 100

6.5.2 實現右鍵選單功能...................................... 101

6.6 使用<command>標記元素.....................102

6.7 使用<progress>標記元素.......................104

6.8 使用<meter>標記元素............................106

6.9 使用樹節點標記元素.............................107

6.9.1 <section>元素.............................................. 108

6.9.2 <nav>元素.................................................... 108

6.9.3 <hgroup>元素.............................................. 110

6.10 使用分組標記元素...............................110

6.10.1 <ul>元素.................................................... 110

6.10.2 <ol>元素.................................................... 111

6.11 使用文本層次語義標記.......................112

6.11.1 <time>元素................................................ 112

6.11.2 <mark>元素............................................... 112

6.11.3 <cite>元素.................................................. 113

6.12 使用<img>標記元素............................113

6.13 使用<iframe>標記元素........................114

6.14 使用<object>標記元素.........................115

第7 章 使用表單元素.................................117

7.1 表單元素的類型.....................................117

7.1.1 email 類型.................................................... 117

7.1.2 url 類型......................................................... 118

7.1.3 number 類型................................................. 119

7.1.4 range 類型.................................................... 120

7.1.5 Date Pickers(數據檢出器)...................... 122

7.1.6 search 類型................................................... 123

7.2 表單元素中的屬性.................................125

7.2.1 記住表單中的數據...................................... 125

7.2.2 驗證表單中輸入的數據是否合法............... 127

7.2.3 在文本框中顯示提示信息.......................... 128

7.2.4 驗證文本框中的內容是否為空................... 129

7.2.5 開啟表單的自動完成功能.......................... 130

7.2.6 重寫表單中的某些屬性.............................. 131

7.2.7 自動設定表單中傳遞數字.......................... 132

7.2.8 在表單中選擇多個上傳檔案....................... 133

7.3 新的表單元素.........................................133

7.3.1 在表單中自動提示輸入文本....................... 134

7.3.2 一個簡單的乘法計算器.............................. 135

7.3.3 在網頁中生成一個密鑰.............................. 136

第8 章 音頻和視頻套用..............................137

8.1 處理視頻..................................................137

8.1.1 <video>標記................................................. 137

8.1.2 <video>標記的屬性..................................... 138

8.2 處理音頻..................................................141

8.2.1 <audio>標記................................................. 141

8.2.2 <audio>標記的屬性..................................... 142

8.3 高級套用..................................................144

8.3.1 為播放的視頻準備一幅素材圖片............... 144

8.3.2 顯示載入視頻的狀態.................................. 145

8.3.3 出錯時在播放螢幕中顯示出錯信息........... 146

8.3.4 檢測瀏覽器是否支持媒體檔案類型........... 147

8.3.5 顯示視頻的播放狀態.................................. 149

8.3.6 顯示播放視頻的時間信息.......................... 151

第9 章 繪圖實戰.........................................153

9.1 使用<canvas>標記..................................153

9.2 HTML DOM Canvas 對象......................154

9.3 HTML 5 繪圖實踐..................................155

9.3.1 在指定位置繪製指定角度的相交線........... 156

9.3.2 繪製一個圓.................................................. 156

9.3.3 在畫布中顯示一幅指定的圖片................... 157

9.3.4 繪製一個指定大小的正方形....................... 157

9.3.5 繪製一個帶框線的矩形.............................. 159

9.3.6 繪製一個漸變圖形...................................... 160

9.3.7 繪製不同的圓形.......................................... 162

9.3.8 繪製一個漸變圓形...................................... 165

9.3.9 移動、縮放和旋轉網頁中的正方形........... 167

9.3.10 使用組合的方式顯示圖形........................ 168

9.3.11 使用不同的方式平鋪指定的圖像............ 170

9.3.12 切割指定的圖像........................................ 172

第10 章 數據存儲.......................................174

10.1 Web 存儲...............................................174

10.1.1 什麼是Web 存儲....................................... 174

10.1.2 Web 存儲的影響........................................ 174

10.2 HTML 5 中的兩種存儲方法................175

10.2.1 使用localStorage 方法.............................. 175

10.2.2 使用sessionStorage 方法........................... 176

10.3 數據存儲對象.......................................177

10.3.1 使用sessionStorage 對象........................... 177

10.3.2 使用localStorage 對象.............................. 179

10.3.3 使用localStorage 對象中的clear()方法... 182

10.3.4 使用localStorage 對象中的屬性.............. 183

10.4 WebDB 存儲方式.................................185

10.4.1 WebDB 存儲基礎...................................... 185

10.4.2 執行事務操作............................................ 186

10.4.3 調用執行SQL 語句................................... 187

10.5 實現一個日記式事務提醒系統...........189

第11 章 使用Web Sockets API.................191

11.1 安裝jWebSocket 伺服器......................191

11.2 實現跨文檔傳輸數據...........................192

11.3 使用WebSocket 傳送數據...................194

11.3.1 使用Web Sockets API 的方法.................. 194

11.3.2 實戰演練.................................................... 195

11.4 處理JSON 對象....................................196

11.5 jWebSocket 框架...................................197

11.5.1 使用jWebSocketTest 框架進行通信........ 197

11.5.2 使用jWebSocketTest 開發一個聊天系統... 200

第12 章 使用Geolocation API...................206

12.1 Geolocation API 介紹...........................206

12.1.1 對瀏覽器的支持情況................................ 206

12.1.2 使用API..................................................... 207

12.2 獲取當前地理位置...............................208

12.3 使用getCurrentPosition()方法.............211

12.4 在網頁中使用地圖...............................212

12.4.1 在網頁中調用地圖.................................... 212

Android 移動網站開發詳解

12.4.2 在地圖中顯示當前的位置........................ 213

12.4.3 在網頁中居中顯示定位地圖..................... 215

12.4.4 利用百度地圖實現定位處理..................... 216

第13 章 使用Web Workers API ................219

13.1 Web Workers API 基礎.........................219

13.1.1 使用HTML 5 Web Workers API .............. 219

13.1.2 需要使用.js 檔案........................................ 220

13.1.3 與Web Worker 進行雙向通信.................. 220

13.2 Worker 執行緒處理..................................222

13.2.1 使用Worker 處理執行緒.............................. 222

13.2.2 使用執行緒傳遞JSON 對象......................... 224

13.2.3 使用執行緒嵌套互動數據............................ 226

13.2.4 通過JSON 傳送訊息................................. 228

13.3 執行大計算量任務...............................230

第3 篇 jQuery Mobile 篇

第14 章 jQuery Mobile 基礎.......................238

14.1 jQuery Mobile 簡介...............................238

14.1.1 jQuery 介紹................................................ 238

14.1.2 jQuery Mobile 的特點................................ 239

14.1.3 對瀏覽器的支持........................................ 239

14.2 jQuery Mobile 的4 個突出特性...........240

14.2.1 跨所有移動平台的統一UI ....................... 240

14.2.2 簡化標記的驅動開發................................ 240

14.2.3 漸進式增強................................................ 241

14.2.4 回響式設計................................................ 241

14.3 實戰演練——在Android 中使用jQuery

設計網頁................................................242

第15 章 jQuery Mobile 語法基礎...............246

15.1 頁面模板................................................246

15.2 多頁面模板...........................................249

15.2.1 一個多頁面模板實例................................ 249

15.2.2 設定內部頁面的頁面標題........................ 250

15.3 使用Ajax 修飾導航..............................251

15.3.1 使用Ajax ................................................... 251

15.3.2 使用changePage()函式.............................. 254

15.3.3 配置Ajax 導航........................................... 255

15.4 對話框....................................................260

15.4.1 實現基本對話框效果................................ 261

15.4.2 使用操作表................................................ 262

15.4.3 實現警告框................................................ 265

15.5 有媒體查詢的回響式布局...................267

第16 章 實現導航功能...............................269

16.1 頁眉欄....................................................269

16.1.1 頁眉基礎.................................................... 269

16.1.2 實現頁眉定位............................................ 269

16.1.3 在頁眉中使用按鈕.................................... 272

16.1.4 在頁眉中使用分段控制項............................ 275

16.1.5 實現回退按鈕效果.................................... 279

16.2 頁腳欄...................................................281

16.2.1 頁腳基礎知識............................................ 281

16.2.2 頁腳定位.................................................... 285

16.2.3 頁腳按鈕.................................................... 285

16.3 工具列...................................................286

16.3.1 帶有圖示的工具列.................................... 286

16.3.2 帶有分段控制項的工具列............................ 288

16.4 標籤欄...................................................289

16.4.1 帶有標準圖示的標籤欄............................ 290

16.4.2 永久標籤欄................................................ 292

16.4.3 有自定義圖示的標籤欄............................ 292

16.4.4 帶有分段控制項的標籤欄............................ 294

第17 章 按鈕..............................................298

17.1 連結按鈕...............................................298

17.2 表單按鈕...............................................299

17.3 圖像按鈕...............................................300

17.4 有圖示的按鈕.......................................301

17.5 只帶有圖示的按鈕...............................303

17.6 實現按鈕定位.......................................305

17.7 自定義按鈕圖示...................................306

17.8 使用分組按鈕.......................................309

17.9 使用主題按鈕.......................................311

17.10 使用動態按鈕.....................................312

17.10.1 按鈕選項.................................................. 312

17.10.2 按鈕方法.................................................. 313

17.10.3 按鈕事件.................................................. 313

17.10.4 動態按鈕演練.......................................... 314

第18 章 表單..............................................317

18.1 表單基礎................................................317

18.2 在表單中輸入文本...............................319

18.2.1 動態輸入文本............................................ 321

18.2.2 文本輸入選項............................................ 321

18.2.3 文本輸入方法............................................ 322

18.2.4 文本輸入事件............................................ 322

18.3 選擇選單................................................324

18.3.1 自定義選擇選單........................................ 326

18.3.2 占位符選項................................................ 327

18.3.3 動態選擇選單............................................ 328

18.3.4 選擇選單選項............................................ 328

18.3.5 選擇選單的方法........................................ 330

18.3.6 選擇選單的事件........................................ 330

18.4 單選按鈕................................................332

18.4.1 複選框和單選按鈕的選項........................ 334

18.4.2 複選框和單選按鈕的方法........................ 335

18.4.3 複選框和單選按鈕的事件........................ 335

18.5 複選框....................................................337

18.5.1 動態複選框................................................ 337

18.5.2 使用複選框................................................ 337

18.6 滑動條....................................................340

18.6.1 滑動條基礎................................................ 341

18.6.2 滑動條的選項............................................ 342

18.6.3 滑動條的方法............................................ 343

18.6.4 滑動條的事件............................................ 343

18.7 開關控制項................................................345

18.7.1 開關控制項基礎............................................ 345

18.7.2 動態開關事件............................................ 347

18.8 使用本地表單元素...............................348

18.9 使用Mobiscroll 日期選擇器................352

第19 章 列表..............................................355

19.1 列表基礎................................................355

19.2 內置列表................................................356

19.3 列表分割線...........................................358

19.4 帶有縮略圖和圖示的列表...................360

19.5 使用拆分按鈕列表...............................365

19.6 使用編號列表.......................................368

19.7 使用唯讀列表.......................................369

19.8 使用列表徽章.......................................372

19.9 使用搜尋欄過濾列表...........................374

19.10 實現動態列表效果.............................378

19.10.1 列表選項.................................................. 378

19.10.2 列表方法.................................................. 380

19.10.3 列表事件.................................................. 381

第20 章 內容格式化...................................383

20.1 使用基本的HTML 樣式......................383

20.2 使用表格進行布局...............................383

20.2.1 表格模板.................................................... 383

20.2.2 兩列表格.................................................... 384

20.2.3 三列表格.................................................... 386

20.2.4 帶有app 圖示的四列表格......................... 387

20.2.5 使用五列表格............................................ 388

20.2.6 多行表格.................................................... 388

20.2.7 不規則的表格............................................ 390

20.2.8 Springboard(蘋果iDevice 的桌面) ...... 391

20.3 可摺疊的內容塊...................................395

20.3.1 嵌套摺疊和摺疊組.................................... 396

20.3.2 創建可摺疊的內容塊................................ 396

20.4 摺疊組標記...........................................398

20.4.1 摺疊組標記(Collapsible set markup)

基礎............................................................ 399

20.4.2 實戰演練.................................................... 399

20.5 使用CSS 設定樣式..............................402

20.5.1 實現背景漸變............................................ 402

20.5.2 在Mozilla 瀏覽器實現背景漸變.............. 404

20.5.3 實現頁眉漸變效果.................................... 406

第21 章 主題化設計...................................409

21.1 主題設計基礎.......................................409

21.2 主題和調色板.......................................411

21.2.1 主題設定.................................................... 412

21.2.2 調色板(swatch) ..................................... 413

21.2.3 全局主題設定(global theme settings) .. 413

21.2.4 結構(structure) ...................................... 414

21.3 主題的默認值.......................................414

21.4 主題的繼承...........................................416

21.5 主題的自定義.......................................420

21.6 ThemeRoller ..........................................426

21.6.1 調色板和全局設定.................................... 427

21.6.2 Preview Inspector 和QuickSwatch Bar ..... 428

21.6.3 使用Adobe Kuler 集成工具...................... 429

21.6.4 使用ThemeRoller ...................................... 429

第22 章 jQuery Mobile 的API....................434

22.1 配置jQuery Mobile...............................434

22.1.1 mobileinit 事件........................................... 434

22.1.2 可配置的jQuery Mobile 選項................... 435

22.2 方法........................................................437

22.3 事件........................................................446

22.3.1 觸摸事件Touch events .............................. 446

22.3.2 虛擬滑鼠事件 Virtual mouse events......... 447

22.3.3 設備方向變化事件

Orientationchange events ........................... 448

22.3.4 滾屏事件Scroll events .............................. 449

22.3.5 頁面載入事件Page load events ................ 451

22.3.6 頁面顯示/隱藏事件Page show/

hide events.................................................. 456

22.3.7 頁面初始化事件Page

initialization events..................................... 457

22.3.8 動畫事件Animation events....................... 459

22.3.9 觸發事件.................................................... 460

22.4 3 個屬性................................................461

22.5 數據屬性...............................................461

22.6 有回響的布局助手...............................464

22.6.1 方向類Orientation Classes ........................ 464

22.6.2 最小/最大寬度折斷點類Min/Max Width

Breakpoint Classes ..................................... 465

22.6.3 添加寬度折斷點 Adding Width

Breakpoints................................................. 465

22.6.4 運行媒介查詢Running Media

Queries ....................................................... 465

第4 篇 綜合實戰篇

第23 章 使用PhoneGap............................468

23.1 PhoneGap 簡介......................................468

23.1.1 產生背景.................................................... 468

23.1.2 什麼是PhoneGap....................................... 469

23.1.3 PhoneGap 的發展歷程............................... 469

23.1.4 全新的功能................................................ 470

23.1.5 PhoneGap 移動Web 開發的步驟............. 470

23.2 搭建PhoneGap 開發環境.....................471

23.2.1 準備工作.................................................... 471

23.2.2 獲得PhoneGap 開發包.............................. 471

23.2.3 創建基於PhoneGap 的HeIIoWorld

程式............................................................ 473

23.3 PhoneGap API 詳解..............................479

23.3.1 套用API..................................................... 480

23.3.2 通知API..................................................... 482

23.3.3 設備API..................................................... 483

23.3.4 網路連線API............................................. 484

23.3.5 加速計API................................................. 486

23.3.6 地理位置API............................................. 489

23.3.7 指南針API................................................. 491

23.3.8 照相機API................................................. 493

23.3.9 採集API..................................................... 496

23.3.10 媒體API................................................... 498

第24 章 開發一個電話本管理系統.............502

24.1 需求分析...............................................502

24.1.1 產生背景.................................................... 502

24.1.2 功能分析.................................................... 502

24.2 創建Android 工程................................503

24.3 實現系統主界面...................................504

24.4 實現信息查詢模組...............................506

24.5 實現系統管理模組...............................508

24.6 實現信息添加模組...............................511

24.7 實現信息修改模組...............................514

24.8 實現信息刪除模組和更新模組...........516

網站開發非常之旅

Android移動網站開發詳解 ISBN:9787302344308

ASP.NET項目開發詳解 ISBN:9787302345725

iOS移動網站開發詳解 ISBN:9787302344858

Java Web開發技術詳解 ISBN:9787302344100

PHP網路編程技術詳解 ISBN:9787302343189

ASP.NET網路編程技術詳解 ISBN:9787302342540

HTML+CSS網頁設計詳解 ISBN:9787302343202

Linux伺服器配置與管理 ISBN:9787302344865

CSS+DIV網頁布局技術詳解 ISBN:9787302345732

Dreamweaver CS6網頁設計與製作詳解 ISBN:9787302344339

相關詞條

相關搜尋

熱門詞條

聯絡我們