① 如何利用html5開發android界面
使用WebView載入HTML即可。
WebView(網路視圖)能載入顯示網頁,可以將其視為一個瀏覽器。它使用了WebKit渲染引擎載入顯示網頁,實現WebView有以下兩種不同的方法:
第一種方法的步驟:
1.在要Activity中實例化WebView組件:WebView webView = new WebView(this);
2.調用WebView的loadUrl()方法,設置WevView要顯示的網頁:
互聯網用:webView.loadUrl("http://www.google.com");
本地文件用:webView.loadUrl("file:///android_asset/XX.html"); 本地文件存放在:assets 文件中
3.調用Activity的setContentView( )方法來顯示網頁視圖
4.用WebView點鏈接看了很多頁以後為了讓WebView支持回退功能,需要覆蓋覆蓋Activity類的onKeyDown()方法,如果不做任何處理,點擊系統回退剪鍵,整個瀏覽器會調用finish()而結束自身,而不是回退到上一頁面
5.需要在AndroidManifest.xml文件中添加許可權,否則會出現Web page not available錯誤。
<uses-permission android:name="android.permission.INTERNET" />
第二種方法的步驟:
1、在布局文件中聲明WebView
2、在Activity中實例化WebView
3、調用WebView的loadUrl( )方法,設置WevView要顯示的網頁
4、為了讓WebView能夠響應超鏈接功能,調用setWebViewClient( )方法,設置 WebView視圖
5、用WebView點鏈接看了很多頁以後為了讓WebView支持回退功能,需要覆蓋覆蓋Activity類的onKeyDown()方法,如果不做任何處理,點擊系統回退剪鍵,整個瀏覽器會調用finish()而結束自身,而不是回退到上一頁面
6、需要在AndroidManifest.xml文件中添加許可權,否則出現Web page not available錯誤。
<uses-permission android:name="android.permission.INTERNET"/>
② html5app開發框架有哪些(用html5開發的app實例)
①:PhoneGap
PhoneGap恐怕是最老的一個框架了,相信很多人都已經聽說過甚至使用過它,但是PhoneGap是基於開源的cordova商業版本。
②:Ionic
IONIC是目前最有潛力的一款HTML5手機應用開發框架。通過SASS構建應用程序,它提供了很多UI組件來幫助開發者開發強大的應用。它使用JavaScriptMVVM框架和AngularJS來增強應用。提供數據的雙向綁定,使用它成為Web和移動開發者的共同選擇。
③:MobileAngularUI
MobileAngularUI是使用bootstrap3和AngularJS的響歷猜余應式移動開發HTML5框架。
MobileAngularUI的關鍵字有:
Bootstrap3
AngularJS
Bootstrap3Mobile組件,比如switches,overlays和sidebars,這些都是bootstrap中沒有的。
AngularJSmoles,比如angular-route,angular-touch和angular-animate
響應式媒體查詢是將bootstrap作為單獨的文件,你只需要包含你所需要的東西。MobileAngularUIu並不包含任何jQuery依賴,你需要做的只是通過一些AngularJS指令創建友好的用戶體驗。
④:IntelXDK
IntelXDK是Inter開發兆或的一款跨平台開發工具,我們可以很容易的通過IntelXDK開發應用,你需要做的只是下載他們的應用開發工具,有Linux、Windows和Mac版,它還提供了很多個開發框架,比如Twitterbootstrap,jQueryMobile和Topcoat.
⑤:Titanium
』sTitanium不同於其它框架的是,它是一個開源的框架。
Titanium是混合式移動應用開發的一站式解決方案,你只需要下載Titaniumstudio就可以解決所有的事情,TitaniumSDK包含了很多手機平台的APIs和後端雲服務。
Titanium使用Alloy,Alloy是一個快速開發的手機應用MVC框架,模塊式開發可以大大減小開發時間,提高代碼復用。
⑥:SenchaTouch
SenchaTouch同樣也是HTML5手機應用跨平台開發框架,運行iOS/Android/Blackberry。它已經誕生很多年了,現在已經成為很常用的混合式編程開發框架。
SenchaTouch可以讓你的WebApp看起來像NativeApp。美麗的用戶界面組件和豐富的數據管理,全部基於最新的HTML5和CSS3的WEB標准,全面兼容Android和AppleiOS設備。
⑦:KendoUI
Telerik』sKendoUI是一個強大的框架用於快速HTML5UI開發。基於最新的HTML5、CSS3和JavaScript標准。
KendoUI包含了開發現代JavaScript開發所需要的所有一切,包括:肢滾強大的數據源,通用的拖拉(Drag-and-Drop)功能,模板,和UI控制項。
③ 如何利用html5開發android界面
H5開發安卓界面需要注意以下三點:
(上)包括Android設備多解析度的問題,Android中構建HTML5應用程序基礎
(中)包括Android與JS之間的互動,Android處理JS的警告對話框等,Android中的調試
(下)包括本地儲存在Android中的應用,地理位置的應用,離線應用的構建
進入正題
● Android設備多解析度的問題
Android瀏覽器默認預覽模式瀏覽 會縮小頁面 WebView中則會以原始大小顯示
Android瀏覽器和WebView默認為mdpi。hdpi相當於mdpi的1.5倍 ldpi相當於0.75倍
三種解決方式:1 viewport屬性 2 CSS控制 3 JS控制
1 viewport屬性放在HTML的<meta>中
html代碼:
<span style="font-size: x-small;"> <head>
<title>Exmaple</title>
<meta name=」viewport」 content=」width=device-width,user-scalable=no」/>
</head></span>
meta中viewport的屬性如下:
<span style="font-size: x-small;"> <meta name="viewport"
content="
height = [pixel_value | device-height] ,
width = [pixel_value | device-width ] ,
initial-scale = float_value ,
minimum-scale = float_value ,
maximum-scale = float_value ,
user-scalable = [yes | no] ,
target-densitydpi = [dpi_value | device-dpi |
high-dpi | medium-dpi | low-dpi]
"
/>
</span>
2 CSS控制設備密度
為每種密度創建獨立的樣式表(注意其中的webkit-device-pixel-ratio 3個數值對應3種解析度)
html代碼:
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.5)" href="hdpi.css" />
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 1.0)" href="mdpi.css" />
<link rel="stylesheet" media="screen and (-webkit-device-pixel-ratio: 0.75)" href="ldpi.css" />
3 JS控制
Android瀏覽器和WebView支持查詢當前設別密度的DOM特性
window.devicePixelRatio 同樣值有3個(0.75,1,1.5對應3種解析度)
JS中查詢設備密度的方法
js代碼:
if (window.devicePixelRatio == 1.5) {
alert("This is a high-density screen");
} else if (window.devicePixelRation == 0.75) {
alert("This is a low-density screen");
}
Android中構建HTML5應用
使用WebView控制項 與其他控制項的使用方法相同 在layout中使用一個<WebView>標簽
WebView不包括導航欄,地址欄等完整瀏覽器功能,只用於顯示一個網頁。
④ 如何讓android 手機支持 html5 video 標簽 播放
Android 是可以通過html5的video來播放視頻的。
一、需要在AndroidManifest.xml文件中聲明需要使用HardwareAccelerate, 可以細化到Activity級別,如果不需要的View可以聲明不要用加速,但是需要在代碼中做
具體如下:
1如果要聲明整個應用都要加速:< application ... android:hardwareAccelerated ="true">
2.如果要在Activity中聲明,則:
<activity ... android:hardwareAccelerated="true" >
Window, getWindow.setFlags( WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED,WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED);