html5會(huì)取代原生的安卓開發(fā)嗎

據(jù)我所知目前各大應(yīng)用里面，純 HTML5 開發(fā)整個(gè)界面的基本沒有，大部分都是說，基本是原生界面，部分內(nèi)容用 H5 的方式來展現(xiàn)，這個(gè)才是主流。

成都創(chuàng)新互聯(lián)專注于陜西企業(yè)網(wǎng)站建設(shè),自適應(yīng)網(wǎng)站建設(shè),商城網(wǎng)站制作。陜西網(wǎng)站建設(shè)公司,為陜西等地區(qū)提供建站服務(wù)。全流程按需定制設(shè)計(jì)，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，成都創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)

未來會(huì)是朝哪個(gè)方向發(fā)展呢？答案肯定還是朝原生的方向發(fā)展，因?yàn)楝F(xiàn)在用戶對(duì)手機(jī)的交互越來越挑剔了，而 H5 的方式你很難做到非常流暢。即使是當(dāng)前流行的混合開發(fā)技術(shù)，像 facebook 出現(xiàn)的 react native，它用 H5 寫代碼，但渲染出來的是原生界面，所以大家都是在追求流暢的交互和體驗(yàn)，如果將這個(gè)作為目標(biāo)的話，作為iOS開發(fā)者以及原生系統(tǒng)的開發(fā)者，應(yīng)該是需求越來越多的，純 H5 開發(fā)的項(xiàng)目基本上已經(jīng)沒有了。

當(dāng)然，我還是希望各位 iOS 開發(fā)者能夠多接觸一些 H5 的知識(shí)，在工作中多多少少還是會(huì)涉及一些混合開發(fā)的界面，如果你懂這些知識(shí)，會(huì)很大程度上幫助你。

如何利用html5開發(fā)android界面

H5開發(fā)安卓界面需要注意以下三點(diǎn)：

（上）包括Android設(shè)備多分辨率的問題，Android中構(gòu)建HTML5應(yīng)用程序基礎(chǔ)

（中）包括Android與JS之間的互動(dòng)，Android處理JS的警告對(duì)話框等，Android中的調(diào)試

（下）包括本地儲(chǔ)存在Android中的應(yīng)用，地理位置的應(yīng)用，離線應(yīng)用的構(gòu)建

進(jìn)入正題

● Android設(shè)備多分辨率的問題

Android瀏覽器默認(rèn)預(yù)覽模式瀏覽 會(huì)縮小頁面 WebView中則會(huì)以原始大小顯示

Android瀏覽器和WebView默認(rèn)為mdpi。hdpi相當(dāng)于mdpi的1.5倍 ldpi相當(dāng)于0.75倍

三種解決方式：1 viewport屬性 2 CSS控制 3 JS控制

1 viewport屬性放在HTML的meta中

html代碼：

span style="font-size: x-small;" head

titleExmaple/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控制設(shè)備密度

為每種密度創(chuàng)建獨(dú)立的樣式表（注意其中的webkit-device-pixel-ratio 3個(gè)數(shù)值對(duì)應(yīng)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支持查詢當(dāng)前設(shè)別密度的DOM特性

window.devicePixelRatio 同樣值有3個(gè)（0.75,1,1.5對(duì)應(yīng)3種分辨率）

JS中查詢?cè)O(shè)備密度的方法

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中構(gòu)建HTML5應(yīng)用

使用WebView控件 與其他控件的使用方法相同 在layout中使用一個(gè)WebView標(biāo)簽

WebView不包括導(dǎo)航欄，地址欄等完整瀏覽器功能，只用于顯示一個(gè)網(wǎng)頁。

做android應(yīng)用開發(fā)需要學(xué)html5/css/js嗎

需要的，因?yàn)楝F(xiàn)在好多的安卓程序或者游戲都是使用html5來實(shí)現(xiàn)的，使用原生的安卓實(shí)現(xiàn)也是有的，如果兩者都會(huì)的話就需要學(xué)習(xí)js html5 css相關(guān)的技術(shù)的