新聞中心
本文主要介紹了關(guān)于 Android 界面適配的相關(guān)內(nèi)容,適合 1-3 年的 Android 開發(fā)工程師閱讀。

創(chuàng)新互聯(lián)公司專注于網(wǎng)站建設(shè)|成都網(wǎng)站改版|優(yōu)化|托管以及網(wǎng)絡(luò)推廣,積累了大量的網(wǎng)站設(shè)計(jì)與制作經(jīng)驗(yàn),為許多企業(yè)提供了網(wǎng)站定制設(shè)計(jì)服務(wù),案例作品覆蓋成都紙箱等行業(yè)。能根據(jù)企業(yè)所處的行業(yè)與銷售的產(chǎn)品,結(jié)合品牌形象的塑造,量身制作品質(zhì)網(wǎng)站。
1. 為什么要適配?
我們先來看一組統(tǒng)計(jì)數(shù)據(jù)和圖表。
【2015 設(shè)備分布圖 】
【2016 設(shè)備分布圖 】
【設(shè)備品牌分布 】
【屏幕尺寸分布圖 】
【系統(tǒng)分布圖 】
【與 iOS 的對(duì)比 】
從上面幾個(gè)圖就可以看出 android 設(shè)備多,品牌多,屏幕尺寸多,還有系統(tǒng)版本分布比較大,碎片化比較嚴(yán)重。這也就是 android 之所以要進(jìn)行適配的原因。此外,android 的適配包括了系統(tǒng)版本的適配,屏幕尺寸的適配等等。
2. 關(guān)于適配各種各樣的概念
單位
px (pixel):像素,屏幕上的點(diǎn),最小的獨(dú)立顯示單位,px 均為整數(shù),沒有小數(shù)。一般都是正方行像素參考鏈接
in:表示英寸,每英寸相當(dāng)于 2.54 厘米。
概念
screen size(屏幕尺寸):屏幕的物理尺寸,表示的是對(duì)角線長(zhǎng),如手機(jī)屏幕 3.5 寸,就表示對(duì)角線長(zhǎng)度為 3.5 寸,大概 8.89 厘米。
屏幕分辨率:指屏幕在橫邊和縱邊上的像素點(diǎn)數(shù),單位是 px,比如1920*1080 3:
屏幕像素密度:dpi(dots per inch),每英寸像素點(diǎn)數(shù),比如 120dpi,160dpi,它與屏幕尺寸與屏幕分辨率有關(guān)。
Android 單位與換算
dp 或者 dip,設(shè)備獨(dú)立像素,即密度無關(guān)像素,注意與 dpi 不同,以 160dpi 為基準(zhǔn),1dip=1px 屏幕密碼,density = dpi / 160,因此如個(gè)屏幕密度為1則1dp = 1px, 如果為2則1dp = 2px 3:sp(scale-independent pixels),字體的推薦單位,可以根據(jù)文字***項(xiàng)進(jìn)行大小縮放,官方建議最小使用值為12sp,其次盡量使用偶數(shù)值。
dpi
- mdpi → [120dpi ~ 160dpi]
- hdpi → [160dpi ~ 240dpi]
- xdpi → [240dpi ~ 320dpi]
- xxdpi → [320dpi ~ 480dpi]
- xxxdpi → [480dpi ~ 640dpi]
案例
比如一個(gè)手機(jī)屏幕分辨率 480*800 , 屏幕尺寸 3.7in,它的 dpi 是多少,在布局中寬設(shè)置 320dp,該寬度為多少像素?
理論計(jì)算值:先計(jì)算出對(duì)角線的像素點(diǎn)數(shù) 480*480 + 800*800 = 933933,再計(jì)算出每英寸的像素點(diǎn)數(shù) 933/3.7 = 252dpi,最終計(jì)算出的 dpi 為 252。 計(jì)算 320dp 對(duì)應(yīng)的像素值:首先計(jì)算出屏幕密度,屏幕密度值則相當(dāng)于 1dp 對(duì)應(yīng)的像素值: 320*(252/160) = 504 px, (手機(jī)屏幕才480px,算出的寬度居然比屏幕還寬,如果成立,則說明如果在上訴屏幕上設(shè)置為320dp,則有一部分處于屏幕外)
注意:手機(jī)上面計(jì)算出的 DPI 為理論值,實(shí)際上只有 120(low)、160(medium)、240(high)、320(xhigh)等這幾種, 因此實(shí)際的計(jì)算公式為: 320*(240 /160)=480px,與屏幕寬度相同,說明在上訴屏幕設(shè)置為320dp,剛好占據(jù)整個(gè)屏幕。
3. 怎么適配?
上面僅僅是知道了為什么適配,和各種各樣的概念,那怎么適配?這里主要看手機(jī),不涉及平板適配。
切圖規(guī)則
從上面的概念我們知道,160dpi 的時(shí)候 1dp=1px,因此在設(shè)計(jì)圖標(biāo)時(shí),(mdpi, hdpi,xhpi,xxhpi,xxhpi)的比例值為 2:3:4:6:8。比如系統(tǒng) icon,mdpi 為 4848,則 xdpi 為 7272,比例值為1.5。 從上圖res結(jié)構(gòu)看到有一類 mipmap- *文件夾,這個(gè)系統(tǒng)新加為了放置系統(tǒng)圖標(biāo)的文件夾。
各種圖標(biāo)的尺寸
以下是官方建議的圖標(biāo)尺寸
寬度值設(shè)置
我們先來看看我們?cè)谝粋€(gè)界面中設(shè)置一個(gè)320dp寬度的一個(gè)view。
從圖上可以看到不同的屏幕上展示了不同的效果(忽略平板),有的手機(jī)上占滿了整個(gè)屏幕寬度,而有的手機(jī)上確只占據(jù)屏幕寬度的一部分。因此在視覺出圖的時(shí)候,比如已800 * 480的尺寸出圖,標(biāo)注占滿整個(gè)屏幕寬度240dp,則真實(shí)展現(xiàn)的效果則會(huì)在各個(gè)手機(jī)上不一致。
因此在開發(fā)中,可以采用match_parent來設(shè)置占滿整個(gè)屏幕,如果是其他尺寸,可以采用自適應(yīng)或者weight來設(shè)置view所占用的寬高。
限定符
我們從上面看到有 *dpi 作為了限定符,同時(shí)還有其他的比如 large限定符,sw 限定符等等限定符,就不一一展開了。
.9圖片
.9圖為系統(tǒng)在圖片周圍加一個(gè)像素的透明邊,圖片必須要以.9作為描述符。 比如以一個(gè)圖片來作為背景,如果不是.9圖片,則如果內(nèi)容區(qū)域大于圖標(biāo),則圖片會(huì)被拉伸。下圖四個(gè)角都被拉伸了。
下圖設(shè)置了圖片的拉伸區(qū)域,則可以看到圖片的四個(gè)角都未被拉伸,這樣最終呈現(xiàn)的視覺效果就好很多。
標(biāo)注位置:相鄰兩邊進(jìn)行標(biāo)注,不能只標(biāo)注一邊,也不能只標(biāo)注相對(duì)的兩邊,如果只標(biāo)注兩邊,則拉伸區(qū)域?yàn)橄嘟徊糠?,文本區(qū)域?yàn)橛疫吪c下邊控制,如果不標(biāo)注則沾滿整個(gè)寬度。
同時(shí)需要注意的是:圖片可以分段標(biāo)注,但圖片最終拉伸的效果與標(biāo)注的像素點(diǎn)有關(guān),比如同一邊上下均被標(biāo)注且上下像素點(diǎn)比為3:1,則最終拉伸比例也是3:1。
4. 更多Tips
- hdpi ,xhdpi 等中的相同圖片大小要成比例,這樣才能在相同屏幕不同分辨率下展現(xiàn)一致。注意上面的 2:3:4:6:8
- 同一類型,圖片大小要一致,可能多人做多個(gè)模塊,導(dǎo)致切除的同一類型圖片相差1,2個(gè)像素(可以建立一個(gè)資源庫,反查已有圖標(biāo)尺寸)。
- 相同圖片問題,不同人做不同模塊,很多圖標(biāo)都是相同的,由于開發(fā)不同,會(huì)導(dǎo)致一個(gè)包中有相同圖片,這樣會(huì)導(dǎo)致包大小增長(zhǎng)。
- 能使用純色的圖片,就讓開發(fā)盡量使用顏色值,不用切圖。
- jpg 與 png 圖片相比較,jpg 大小會(huì)小很多,如果有大圖且沒有模糊漸變等要求,盡量采用 jpg 格式。
- 很多簡(jiǎn)單圖片都能用代碼實(shí)現(xiàn),比如圓,矩形等,可以讓開發(fā)用代碼實(shí)現(xiàn),減少包的大小。
- 如果包的大小太大時(shí),盡量保證更高尺寸的圖片存在,這樣低屏幕密度的手機(jī)也能展現(xiàn)很清晰的圖片,但是如果只有小圖,就會(huì)放大拉伸,會(huì)導(dǎo)致圖片變形或者不清晰。
- .9 注意標(biāo)注拉伸區(qū)域與內(nèi)容區(qū)域,與圖片外邊距的 padding,可以在圖上直接標(biāo)注。(如果內(nèi)容區(qū)域上下距離不相等,再填充多行文字時(shí)會(huì)造成文字不居中,這時(shí)可以直接在圖片上空出 padding)
- .9 圖片只能拉伸不能壓縮,壓縮會(huì)導(dǎo)致圖片變形,因此在作圖過程中要確定一下圖片的最小尺寸,(比如,給出一個(gè)確定高度的矩形區(qū)域,里面放置一個(gè)初始高度大于矩形的 .9 圖片,會(huì)導(dǎo)致圖片壓縮)。
- .9 圖片一般只做小尺寸就可以,除非邊框有漸變等元素,才做多個(gè)尺寸。
- 關(guān)于圖片標(biāo)注,美術(shù)要轉(zhuǎn)換一下單位,px 轉(zhuǎn)換到相應(yīng)的 dp 上,開發(fā)可以直接使用該數(shù)值。
- 關(guān)于字體,字體大小 sp,但是如果字體呈現(xiàn)在一個(gè)固定高度的矩形框中時(shí),再能調(diào)整字體大小的手機(jī)上時(shí),可能會(huì)展示不全(展現(xiàn)字體的外部圖片,背景等盡量不要寫死高度)。
- 標(biāo)注圖片時(shí),如果一個(gè) icon 占滿整個(gè)寬度,則可以不用標(biāo)注icon寬度尺寸,只需要標(biāo)注距離邊框的尺寸,開發(fā)會(huì)采用自適應(yīng),如果確定寬度,在有的屏幕上只能占據(jù)一半寬度。
看到這里,不知道你對(duì)自己的Android開發(fā)經(jīng)驗(yàn)是不是有了更多的感悟。
【本文為專欄作者“stormzhang”原創(chuàng)稿件,轉(zhuǎn)載請(qǐng)聯(lián)系原作者(微信號(hào):googdev)】
戳這里,看該作者更多好文
網(wǎng)頁題目:關(guān)于 Android 適配,看完這篇文章就夠了
文章地址:http://m.fisionsoft.com.cn/article/dhscgpi.html


咨詢
建站咨詢
