android 螢幕適配
阿新 • • 發佈:2020-10-15
曾一度為android適配感到頭疼,碎片化嚴重不說,android中特有的尺寸概念UI設計人員基本不懂;一般UI設計人員設計的尺寸都是用px標註的,開發人員在佈局時無法直接對號入座;針對以上情況,特總結一下適配方案。
一.基本概念
螢幕尺寸
- 含義:手機對角線的物理尺寸
- 單位:英寸(inch),1英寸=2.54cm
Android手機常見的尺寸有5寸、5.5寸、6寸等等
螢幕解析度
- 含義:手機在橫向、縱向上的畫素點數總和
- 一般描述成螢幕的"寬x高”=AxB
- 含義:螢幕在橫向方向(寬度)上有A個畫素點,在縱向方向
(高)有B個畫素點 - 例子:1080x1920,即寬度方向上有1080個畫素點,在高度方向上有1920個畫素點
-
單位:px(pixel),1px=1畫素點
UI設計師的設計圖會以px作為統一的計量單位
-
Android手機常見的解析度:320x480、480x800、720x1280、1080x1920
螢幕畫素密度
- 含義:每英寸的畫素點數
- 單位:dpi(dots per ich)
假設裝置內每英寸有160個畫素,那麼該裝置的螢幕畫素密度=160dpi
- 安卓手機對於每類手機螢幕大小都有一個相應的螢幕畫素密度:
密度型別 | 代表的解析度(px) | 螢幕畫素密度(dpi) |
---|---|---|
低密度(ldpi) | 240x320 | 120 |
中密度(mdpi) | 320x480 | 160 |
高密度(hdpi) | 480x800 | 240 |
超高密度(xhdpi) | 720x1280 | 320 |
超超高密度(xxhdpi) | 1080x1920 | 480 |
螢幕尺寸、解析度、畫素密度三者關係
一部手機的解析度是寬x高,螢幕大小是以寸為單位,那麼三者的關係是:
密度無關畫素
- 含義:density-independent pixel,叫dp或dip,與終端上的實際物理畫素點無關。
-
單位:dp,可以保證在不同螢幕畫素密度的裝置上顯示相同的效果
- Android開發時用dp而不是px單位設定圖片大小,是Android特有的單位
- 場景:假如同樣都是畫一條長度是螢幕一半的線,如果使用px作為計量單位,那麼在480x800解析度手機上設定應為240px;在320x480的手機上應設定為160px,二者設定就不同了;如果使用dp為單位,在這兩種解析度下,160dp都顯示為螢幕一半的長度。
-
dp與px的轉換
因為ui設計師給你的設計圖是以px為單位的,Android開發則是使用dp作為單位的,那麼我們需要進行轉換:
密度型別 | 代表的解析度(px) | 螢幕密度(dpi) | 換算(px/dp) | 比例 |
---|---|---|---|---|
低密度(ldpi) | 240x320 | 120 | 1dp=0.75px | 3 |
中密度(mdpi) | 320x480 | 160 | 1dp=1px | 4 |
高密度(hdpi) | 480x800 | 240 | 1dp=1.5px | 6 |
超高密度(xhdpi) | 720x1280 | 320 | 1dp=2px | 8 |
超超高密度(xxhdpi) | 1080x1920 | 480 | 1dp=3px | 12 |
在Android中,規定以160dpi(即螢幕解析度為320x480)為基準:1dp=1px
獨立比例畫素
- 含義:scale-independent pixel,叫sp或sip
- 單位:sp
- Android開發時用此單位設定文字大小,可根據字型大小首選項進行縮放
- 推薦使用12sp、14sp、18sp、22sp作為字型設定的大小,不推薦使用奇數和小數,容易造成精度的丟失問題;小於12sp的字型會太小導致使用者看不清
二 dp值適配
根據UI設計人員提供的手機規格(螢幕尺寸和螢幕密度),得出螢幕密度,然後再根據螢幕密度換算(160dpi螢幕密度下,1dp=1px)出控制元件dp的大小值(這裡推薦一款軟體Pxcook)。
這種適配方式不精準,且當手機規格差異較大時,這種方式無效。
三 百分比佈局
這種方式是通過對每種不同解析度的螢幕都要適配一套尺寸檔案,每個檔案中尺寸都是對照一個基準尺寸檔案來建立的。
UI設計師給出如下尺寸:
1.建立values-320*480尺寸檔案,並以其為基準
<resources> <dimen name="A_width">100px</dimen> <dimen name="B_width">220px</dimen> </resources>
2.如果要適配480*800解析度的螢幕
<resources> <dimen name="A_width">150px</dimen> <dimen name="B_width">330px</dimen> </resources>
A_width始終只佔全寬的31.25%
轉載於:https://my.oschina.net/kun123/blog/875472