您好,登錄后才能下訂單哦!
這篇文章主要講解了“html5有哪些app開發框架”,文中的講解內容簡單清晰,易于學習與理解,下面請大家跟著小編的思路慢慢深入,一起來研究和學習“html5有哪些app開發框架”吧!
本教程操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。
HTML5移動開發的10大移動APP開發框架
jquery mobile框架
bootstrap框架
ionic框架
Mobile Angular UI框架
Intel XDK框架
Appcelerator Titanium框架
Sencha Touch框架
Kendo UI框架
PhoneGap框架
mui框架
1.jquery mobile框架
jQuery Mobile
是jQuery
在手機上和平板設備上的版本。jQuery Mobile
不僅會給主流移動平臺帶來jQuery
核心庫,而且會發布一個完整統一的jQuery
移動UI
框架。支持全球主流的移動平臺。
2.bootstrap框架
Bootstrap
是基于HTML
、CSS
、JAVASCRIPT
的,它簡潔靈活,使得Web
開發更加快捷。它由Twitter
的設計師Mark Otto
和Jacob Thornton
合作開發,是一個CSS/HTML
框架。Bootstrap
提供了優雅的HTML
和CSS
規范,它即是由動態CSS
語言Less
寫成。Bootstrap
一經推出后頗受歡迎,一直是GitHub
上的熱門開源項目,包括NASA
的MSNBC
(微軟全國廣播公司)的Breaking News
都使用了該項目。 國內一些移動開發者較為熟悉的框架,如WeX5
前端開源框架等,也是基于Bootstrap
源碼進行性能優化而來。
3.ionic框架
Ionic
是一個強大的HTML5
應用程序開發框架,可以幫助您使用Web
技術,比如HTML
、CSS
和Javascript
構建接近原生體驗的移動應用程序。Ionic
主要關注外觀和體驗,以及和你的應用程序的UI
交互,特別適合用于基于Hybird
模式的HTML5
移動應用程序開發。
4.Mobile Angular UI框架
Mobile Angular UI是使用 bootstrap 3 和 AngularJS 的響應式移動開發HTML5框架。
Mobile Angular UI
的關鍵字有:
1. Bootstrap 3
2. AngularJS
Bootstrap 3 Mobile
組件,比如switches
, overlays
和sidebars
,這些都是bootstrap
中沒有的。
AngularJS modules
,比如angular-route
, angular-touch
和angular-animate
響應式媒體查詢是將bootstrap
作為單獨的文件,你只需要包含你所需要的東西。Mobile Angular UIu
并不包含任何jQuery
依賴,你需要做的只是通過一些AngularJS
指令創建友好的用戶體驗。
5.Intel XDK框架
Intel
發布了其首個版本基于web
的編程工具,可幫助開發者為Android
和iOS
開發移動應用。這款免費的軟件名為Intel XDK
,實際上這是今年2月份Intel
收購的AppMobi
軟件的重新包裝后的版本,所以并非新鮮事物。開發者可用此軟件開發基于HTML5
的應用,并用于移動設備中。
6.Appcelerator Titanium框架
Titanium
是一個跟手機平臺無關的開發框架,用來開發具有本地應用效果的Web
應用。當前主要支持iPhone
和Android
手機。
主要提供的API包括:
2D/3D animations
Geo-location, compass, and maps
Augmented reality features
Social app authentication and native client support for email
SOAP or REST API calls
Audio, video, and image capture and playback
Taps into local filesystem and SQL lite databases
Accesses photo gallery or address data
7.Sencha Touch框架
Sencha Touch
框架是世界上第一個基于HTML5
的Mobile App
框架。Sencha Touch
可以讓你的Web App
看起來像Native App
。美麗的用戶界面組件和豐富的數據管理,全部基于最新的HTML5
和CSS3
的WEB
標準,全面兼容Android
和Apple iOS
設備。提供了豐富的WEB UI
組件,可以快速的開發出運行于移動終端的應用程序。
8.Kendo UI框架
Kendo UI
的每個方面都從底層開始構建,以提供強大的JavaScript
應用程序性能。Kendo UI
不是另一個jQuery UI
的克隆,它的每一個決定都是從優化性能出發。從輕量級的、執行明顯快于jQurey
模板的內置模板庫,到利用CSS3
硬件加速的(如果可能)優化動畫 和先進的虛擬化用戶界面,Kendo UI
不遺余力地提供高性能的客戶端UI。
9.PhoneGap框架
說到跨平臺開發工具,很多人首先會想到PhoneGap
。這樣一款能夠讓開發者使用HTML
、JS
、CSS
來開發跨平臺移動App的開源免費框架,一直以來都深受開發者喜愛,從iOS
、Android
、BB10
、Windows Phone
到Amazon Fire OS
、Tizen
等,各大主流移動平臺一應俱全,還能讓開發者充分利用地理位置、加速器、聯系人、聲音等手機核心功能。
業界很多主流的移動開發框架均源于PhoneGap
。較著名的有Worklight
、appMobi
、WeX5
等。其中WeX5
為國內打造,完全Apache
開源,在融合Phonegap
的基礎上,做了深度優化,具備接近Native app
的性能,同時開發便捷性也較好。
10.mui框架
最接近原生APP
體驗的高性能前端框架,具有以下特點:
輕量
追求性能體驗,是我們開始啟動MUI
項目的首要目標,輕量必然是重要特征;
MUI
不依賴任何第三方JS
庫,壓縮后的JS
和CSS
文件僅有100+K
和60+K
原生UI
鑒于之前的很多前端框架(特別是響應式布局的框架),UI
控件看起來太像網頁,沒有原生感覺,因此追求原生UI
感覺也是我們的重要目標
MUI以iOS
平臺UI為基礎,補充部分Android
平臺特有的UI
控件
流暢體驗
拉刷新
為實現下拉刷新功能,大多H5
框架都是通過div
模擬下拉回彈動畫,在低端android
手機上,div
動畫經常出現卡頓現象(特別是圖文列表的情況); mui
通過雙webview
解決這個div
的拖動流暢度問題;拖動時,拖動的不是div
,而是一個完整的webview
(子webview
),回彈動畫使用原生動畫。
側滑導航
mui
提供了兩種側滑導航實現:webview
模式和div
模式,兩種模式各有優劣,適用于不同的場景。每種側滑實現模式,有不同的側滑動畫效果,主要分為四類:
動畫1:主界面移動、菜單不動
動畫2:主界面不動、菜單移動
動畫3:主界面和菜單同時移動
動畫4:縮放式側滑(類手機QQ)
滑動觸發操作菜單
在手機應用中(特別是iOS
平臺),很多操作菜單都是滑動觸發的,比如短信界面,左滑顯示“刪除”按鈕,點擊可以刪除該短信對話;郵件列表界面,左滑可以刪除,右滑可以標注為”已讀/未讀”狀態;mui
的列表控件也支持滑動觸發操作菜單功能,僅需按照特定格式拼裝DOM
結構即可;另外,滑動還支持事件觸發,開發者可以通過監聽滑動事件(slideleft/slideright
),完成操作前的確認提醒工作。
感謝各位的閱讀,以上就是“html5有哪些app開發框架”的內容了,經過本文的學習后,相信大家對html5有哪些app開發框架這一問題有了更深刻的體會,具體使用情況還需要大家實踐驗證。這里是億速云,小編將為大家推送更多相關知識點的文章,歡迎關注!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。