使用Sencha Touch和jQuery Mobile開發(fā)移動應(yīng)用教程
Sencha Touch和jQuery Mobile開發(fā)移動應(yīng)用是本文要介紹的內(nèi)容,主要是來了解HTML5在移動開發(fā)領(lǐng)域的兩個優(yōu)秀框架:Sencha Touch 和 jQuery Mobile,來看詳解內(nèi)容講解。
HTML5雖然離全面普及還有很長的時間,但在一些開發(fā)領(lǐng)域,HTML5已經(jīng)嶄露頭角。比如在移動開發(fā)中,HTML5更能體現(xiàn)其跨平臺的特性 (Flash雖然積極努力,但仍然被iOS等系統(tǒng)拒之門外),說到這里,不得不提一下HTML5在移動開發(fā)領(lǐng)域的兩個優(yōu)秀框架:Sencha Touch 和 jQuery Mobile。
本文將站在一個Flash開發(fā)者的角度,以一個簡單的RSS閱讀器實例(這個實例已經(jīng)在這篇文章《走進Android[1]:如何開發(fā)基于Adobe AIR的Android應(yīng)用》中實現(xiàn)過),初步為大家介紹一下使用這兩個框架構(gòu)建移動應(yīng)用的差異。
前置知識
首先您需要大致了解Sencha Touch 和 jQuery Mobile。
Sencha Touch簡介:
前不久基于JavaScript編寫的Ajax框架ExtJS,將現(xiàn)有的ExtJS整合JQTouch、Raphaël庫,推出適用于最前沿Touch Web的Sencha Touch框架,該框架是世界上***個基于HTML5的移動應(yīng)用框架。進入Sencha Touch官方網(wǎng)站查看更多介紹。
jQuery Mobile簡介:
為了讓移動設(shè)備也能用上jQuery,jQuery開發(fā)團隊發(fā)布了jQuery移動設(shè)備版開發(fā)項目jQuery Mobile Project(http://jquerymobile.com)。jQuery Mobile不僅會給主流移動平臺帶來jQuery核心庫,而且會發(fā)布一個完整統(tǒng)一的jQuery移動UI框架。
工具
工欲善其事,必先利其器,開發(fā)之前,要先準(zhǔn)備好開發(fā)工具和調(diào)試工具。
IDE:可以使用任意文本編輯器,隨您哪個順手就用哪個,本文將使用Eclipse+Spket,這是一個非常不錯的,主要用于開發(fā)Ext應(yīng)用的插件,但經(jīng)過配置也可用于jQuery開發(fā),點擊這里查看詳細介紹。
調(diào)試工具:很遺憾Firefox對Sencha Touch的渲染效果非常差,所以我們不能使用Firebug來調(diào)試??梢允褂霉雀铻g覽器,其調(diào)試工具也不遜色,而對這兩款框架的支持程度都尚好。而為了 驗證Sencha Touch的效果無偏差,***再裝一個Safari瀏覽器,它對Sencha Touch的渲染是***的。
最終運行效果(點擊查看大圖)
在線預(yù)覽(請使用Safari或谷歌瀏覽器觀看):
Sencha Touch版:
- http://www.riameeting.com/examples/sencha/
jQuery Mobile版:
- http://www.riameeting.com/examples/jqmobile/
小結(jié):使用Sencha Touch和jQuery Mobile開發(fā)移動應(yīng)用的內(nèi)容介紹完了,希望通過本文的學(xué)習(xí)能對你有所幫助!