Android分辨率小知識

以下內容為轉載羊精,涉及版權問題請聯(lián)系原文作者钮热。原文地址>>

不少設計師和工程師都被安卓設備紛繁的屏幕搞得暈頭轉向雌隅,我既做UI設計,也做過一點安卓界面布局臼婆,剛好對這塊內容比較熟悉抒痒,也曾在公司內部做過相關的講座,在此颁褂,我將此部分知識重新梳理出來分享給大家故响!

1傀广、了解幾個概念
(1)分辨率。分辨率就是手機屏幕的像素點數彩届,一般描述成屏幕的“寬×高”伪冰,安卓手機屏幕常見的分辨率有480×800、720×1280惨缆、1080×1920等糜值。720×1280表示此屏幕在寬度方向有720個像素,在高度方向有1280個像素坯墨。
(2)屏幕大小寂汇。屏幕大小是手機對角線的物理尺寸,以英寸(inch)為單位捣染。比如某某手機為“5寸大屏手機”骄瓣,就是指對角線的尺寸,5寸×2.54厘米/寸=12.7厘米耍攘。
(3)密度(dpi榕栏,dots per inch;或PPI蕾各,pixels per inch)扒磁。從英文顧名思義,就是每英寸的像素點數式曲,數值越高當然顯示越細膩妨托。假如我們知道一部手機的分辨率是1080×1920,屏幕大小是5英寸吝羞,你能否算出此屏幕的密度呢兰伤?哈哈,中學的勾股定理派上用場啦钧排!通過寬1080和高1920敦腔,根據勾股定理,我們得出對角線的像素數大約是2203恨溜,那么用2203除以5就是此屏幕的密度了符衔,計算結果是440。440dpi的屏幕已經相當細膩了糟袁。

2柏腻、實際密度與系統(tǒng)密度
尚未發(fā)現他處使用“實際密度”和“系統(tǒng)密度”這兩個詞匯,暫時由我如此定義吧系吭。
“實際密度”就是我們自己算出來的密度,這個密度代表了屏幕真實的細膩程度颗品,如上述例子中的440dpi就是實際密度肯尺,說明這塊屏幕每寸有440個像素沃缘。5英寸1080×1920的屏幕密度是440嫌蚤,而相同分辨率的4.5英寸屏幕密度是490购撼。如此看來系馆,屏幕密度將會出現很多數值暖眼,呈現嚴重的碎片化昼丑。而密度又是安卓屏幕將界面進行縮放顯示的依據颜凯,那么安卓是如何適配這么多屏幕的呢湿颅?
其實叨襟,每部安卓手機屏幕都有一個初始的固定密度敬扛,這些數值是120晰洒、160、240啥箭、320谍珊、480,我們權且稱為“系統(tǒng)密度”急侥。大家發(fā)現規(guī)律沒有砌滞?相隔數值之間是2倍的關系。一般情況下坏怪,240×320的屏幕是低密度120dpi贝润,即ldpi;320×480的屏幕是中密度160dpi铝宵,即mdpi打掘;480×800的屏幕是高密度240dpi,即hdpi捉超;720×1280的屏幕是超高密度320dpi胧卤,即xhdpi;1080×1920的屏幕是超超高密度480dpi拼岳,即xxhdpi枝誊。
安卓對界面元素進行縮放的比例依據正是系統(tǒng)密度,而不是實際密度惜纸。


3叶撒、一個重要的單位dp
dp也可寫為dip,即density-independent pixel耐版。你可以想象dp更類似一個物理尺寸祠够,比如一張寬和高均為100dp的圖片在320×480和480×800的手機上“看起來”一樣大。而實際上粪牲,它們的像素值并不一樣古瓤。dp正是這樣一個尺寸,不管這個屏幕的密度是多少,屏幕上相同dp大小的元素看起來始終差不多大落君。
另外穿香,文字尺寸使用sp,即scale-independentpixel的縮寫绎速,這樣皮获,當你在系統(tǒng)設置里調節(jié)字號大小時,應用中的文字也會隨之變大變小纹冤。


4洒宝、dp與px的轉換
在安卓中,系統(tǒng)密度為160dpi的中密度手機屏幕為基準屏幕萌京,即320×480的手機屏幕雁歌。在這個屏幕中,1dp=1px枫夺。
100dp在320×480(mdpi将宪,160dpi)中是100px。那么100dp在480×800(hdpi橡庞,240dpi)的手機上是多少px呢较坛?我們知道100dp在兩個手機上看起來差不多大,根據160與240的比例關系扒最,我們可以知道丑勤,在480×800中,100dp實際覆蓋了150px吧趣。因此法竞,如果你為mdpi手機提供了一張100px的圖片,這張圖片在hdpi手機上就會拉伸至150px强挫,但是他們都是100dp岔霸。
中密度和高密度的縮放比例似乎可以不通過160dpi和240dpi計算,而通過320px和480px也可以算出俯渤。但是按照寬度計算縮放比例不適用于超高密度xhdpi和超超高密度xxhdpi了呆细。即720×1280中1dp是多少px呢?如果用720/320八匠,你會得出1dp=2.25px絮爷,實際這樣算出來是不對的。dp與px的換算要以系統(tǒng)密度為準梨树,720×1280的系統(tǒng)密度為320坑夯,320×480的系統(tǒng)密度為160,320/160=2抡四,那么在720×1280中柜蜈,1dp=2px仗谆。同理,在1080×1920中跨释,1dp=3px胸私。
大家可以記住下面這個比例,dp與px的換算就十分easy啦鳖谈!
ldpi:mdpi:hdpi:xhdpi:xxhdpi=3:4:6:8:12,我們發(fā)現阔涉,相隔數字之間還是2倍的關系缆娃。計算的時候,以mdpi為基準瑰排。比如在720×1280(xhdpi)中贯要,1dp等于多少px呢?mdpi是4椭住,xhdpi是8崇渗,2倍的關系,即1dp=2px京郑。反著計算更重要宅广,比如你用PhotoShop在720×1280的畫布中制作了界面效果圖,兩個元素的間距是20px些举,那要標注多少dp呢跟狱?2倍的關系,那就是10dp户魏!

當安卓系統(tǒng)字號設為“普通”時驶臊,sp與px的尺寸換算和dp與px是一樣的。比如某個文字大小在720×1280的PS畫布中是24px叼丑,那么告訴工程師关翎,這個文字大小是12sp。

5鸠信、建議在xdhpi中作圖(此處相關修正見后面補充纵寝,此處暫保留初始版本)
安卓手機有這么多屏幕,我到底依據哪種屏幕作圖呢症副?沒有必要為不同密度的手機都提供一套素材店雅,大部分情況下,一套就夠了贞铣。
現在手機比較高的分辨率是1080×1920闹啦,你可以選擇這個尺寸作圖,但是圖片素材將會增大應用安裝包的大小辕坝。并且尺寸越大的圖片占用的內存也就越高窍奋。如果你不是設計ROM,而是做一款應用,我建議大家用PS在720×1280的畫布中作圖琳袄。這個尺寸兼顧了美觀性江场、經濟性和計算的簡單。美觀性是指窖逗,以這個尺寸做出來的應用址否,在720×1280中顯示完美,在1080×1920中看起來也比較清晰碎紊;經濟性是指佑附,這個分辨率下導出的圖片尺寸適中,內存消耗不會過高仗考,并且圖片文件大小適中音同,安裝包也不會過大;計算的簡單秃嗜,就是1dp=2px啊权均,多好計算啊锅锨!
做出來的圖片叽赊,記著讓界面工程師放進drawable-xhdpi的資源文件夾中。

6橡类、屏幕的寬高差異
在720×1280中作圖蛇尚,要考慮向下兼容不同的屏幕。通過計算我們可以知道顾画,320×480和480×800的屏幕寬度都是320dp取劫,而720×1280和1080×1920的屏幕寬度都是360dp。它們之間有40dp的差距研侣,這40dp在設計中影響還是很大的谱邪。如下圖蝴蝶圖片距離屏幕的左右邊距在320dp寬的屏幕和360dp寬的屏幕中就不一樣。

不僅寬度上有差異庶诡,高度上的差異更加明顯惦银。對于天氣等工具類應用,由于界面一般是獨占式的末誓,更要考慮屏幕之間的比例差異扯俱。

如果想消除這些比例差異,可以通過添加布局文件來實現喇澡。一般情況下迅栅,布局文件放在layout文件夾中,如果要單獨對360dp的屏幕進行調整晴玖,你可以單做做一個布局文件放在layout-w360dp中读存;不過为流,最好是默認針對360dp的屏幕布局(較為主流),然后對320dp的屏幕單獨布局让簿,將布局文件放到layout-w320dp中敬察;如果你想對某個特殊的分辨率進行調整,那么你可以將布局文件放在標有分辨率的文件夾中尔当,如layout-854×480莲祸。

7、幾個資源的文件夾
在720×1280中做了圖片椭迎,要讓開發(fā)人員放到drawable-xhdpi的資源文件夾中虫给,這樣才可以顯示正確。個人認為僅提供一套素材就可以了侠碧,可以測試一下應用在低端手機上運行是否流暢,如果比較卡頓缠黍,可以根據需要提供部分mdpi的圖片素材弄兜,因為xhdpi中的圖片運行在mdpi的手機上會比較占內存。
以應用圖標為例瓷式,xhdpi中的圖標大小是96px替饿,如果要單獨給mdpi提供圖標,那么這個圖標大小是48px贸典,放到drawable-mdpi的資源文件夾中视卢。各個資源文件夾中的圖片尺寸同樣符合ldpi:mdpi:hdpi:xhdpi:xxhdpi=3:4:6:8:12的規(guī)律。

如果你把一個高2px的分割線素材做成了9.png圖片廊驼,你想讓細線在不同密度中都是2px据过,而不被安卓根據密度進行縮放,怎么辦妒挎?你可以把這個分割線素材放到drawable-nodpi中绳锅,這個資源文件夾中的圖片,將按照實際像素大小進行顯示酝掩,而不會被安卓根據密度進行縮放鳞芙。即在mdpi中細線是2px(2dp),在xhdpi中細線是2px(1dp)期虾。

以上是對安卓屏幕的初步總結原朝,不知道你看完后是豁然開朗,還是一頭霧水镶苞?這篇文章主要為了實用起見喳坠,避開了過多深入的分析,如果你還有什么疑問宾尚,可以留言丙笋。


最后補充一下谢澈,不少朋友問我安卓平板的設計,提到最多的是1280×800的分辨率御板,這個分辨率的平板一般是10.1寸的中密度屏幕锥忿,直接在PS中建立1280×800的畫布,提取之后的素材讓開發(fā)放到drawable-mdpi中即可怠肋。并且中密度的平板中敬鬓,1dp=1px,比較好換算單位笙各。


【2016年2月19日補充】感謝大家對這篇文章的肯定钉答,時間飛逝,這篇文章的理論成型于三年前杈抢,發(fā)表于兩年前数尿,這幾年手機硬件的發(fā)展十分迅速,屏幕分辨率1080×1920已是標配惶楼,2560x1440的2K屏也是屢見不鮮右蹦。伴隨著硬件的發(fā)展,上述相關理論也應當做一些修正歼捐,在720×1080的畫布中作圖貌似已經不合時宜了何陆。

大家完全可以在1080×1920(xxhdpi)分辨率的畫布中作圖,主要的圖片素材從1080×1920的畫布中提取并讓程序員放置在drawable-xxhdpi中豹储;對于小圖標等線條較為精細的圖片贷盲,可以制作和提取兩套不同尺寸的圖標,一套按照xxhdpi來做剥扣,一套按照xhdpi來做巩剖。

在1080×1920(xxhdpi)這個分辨率中,dp和px的關系為:1dp=3px朦乏,這個也比較好計算球及。大家作圖的時候,元素尺寸以及各種間隙最好選擇3的倍數呻疹,以便于轉換為dp吃引。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市刽锤,隨后出現的幾起案子镊尺,更是在濱河造成了極大的恐慌,老刑警劉巖并思,帶你破解...
    沈念sama閱讀 207,113評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件庐氮,死亡現場離奇詭異,居然都是意外死亡宋彼,警方通過查閱死者的電腦和手機弄砍,發(fā)現死者居然都...
    沈念sama閱讀 88,644評論 2 381
  • 文/潘曉璐 我一進店門仙畦,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人音婶,你說我怎么就攤上這事慨畸。” “怎么了衣式?”我有些...
    開封第一講書人閱讀 153,340評論 0 344
  • 文/不壞的土叔 我叫張陵寸士,是天一觀的道長。 經常有香客問我碴卧,道長弱卡,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,449評論 1 279
  • 正文 為了忘掉前任住册,我火速辦了婚禮婶博,結果婚禮上,老公的妹妹穿的比我還像新娘荧飞。我一直安慰自己凡蜻,他們只是感情好,可當我...
    茶點故事閱讀 64,445評論 5 374
  • 文/花漫 我一把揭開白布垢箕。 她就那樣靜靜地躺著,像睡著了一般兑巾。 火紅的嫁衣襯著肌膚如雪条获。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,166評論 1 284
  • 那天蒋歌,我揣著相機與錄音帅掘,去河邊找鬼。 笑死堂油,一個胖子當著我的面吹牛修档,可吹牛的內容都是我干的。 我是一名探鬼主播府框,決...
    沈念sama閱讀 38,442評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼吱窝,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了迫靖?” 一聲冷哼從身側響起院峡,我...
    開封第一講書人閱讀 37,105評論 0 261
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎系宜,沒想到半個月后照激,有當地人在樹林里發(fā)現了一具尸體,經...
    沈念sama閱讀 43,601評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡盹牧,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,066評論 2 325
  • 正文 我和宋清朗相戀三年俩垃,在試婚紗的時候發(fā)現自己被綠了励幼。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,161評論 1 334
  • 序言:一個原本活蹦亂跳的男人離奇死亡口柳,死狀恐怖苹粟,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情啄清,我是刑警寧澤六水,帶...
    沈念sama閱讀 33,792評論 4 323
  • 正文 年R本政府宣布,位于F島的核電站辣卒,受9級特大地震影響掷贾,放射性物質發(fā)生泄漏。R本人自食惡果不足惜荣茫,卻給世界環(huán)境...
    茶點故事閱讀 39,351評論 3 307
  • 文/蒙蒙 一想帅、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧啡莉,春花似錦港准、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,352評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至魄咕,卻和暖如春衩椒,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背哮兰。 一陣腳步聲響...
    開封第一講書人閱讀 31,584評論 1 261
  • 我被黑心中介騙來泰國打工毛萌, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人喝滞。 一個月前我還...
    沈念sama閱讀 45,618評論 2 355
  • 正文 我出身青樓阁将,卻偏偏與公主長得像,于是被迫代替她去往敵國和親右遭。 傳聞我的和親對象是個殘疾皇子做盅,可洞房花燭夜當晚...
    茶點故事閱讀 42,916評論 2 344

推薦閱讀更多精彩內容