以前第一次做APP的案子時,是QA的腳色,一直都有遇到Android因為不同的device有不同的resolution
因此在測試的時候都會盡量找不一樣大小的手機來測試,但繁忙的工作讓我一直沒有時間去瞭解與思考 為什麼?
趁現在剛開始工作沒多久,有比較多的時間study,將這幾天閱讀Android Developer,作一些整理。
資料來源:http://developer.android.com/design/style/metrics-grids.html
為了簡化multiple screen的設計,Android使用size buckets和density buckets來計算不同的device。
Size Buckets手持行動裝置(handset)會小於600dp,而平板(tablet)則大於等於600dp。
Density Buckets則有LDPI(Low,120dpi), MDPI(Medium,160dpi), HDPI(High,240dpi), XHDPI(Extra High, 320dpi), XXHDPI(480dpi), and XXXHDPI(640dpi).
建議的Touch UI設計為48dp,只為什麼要這樣設計呢?難道這是布林、佩吉的黃金比例?
原來平均48db換算成實體的大小大約是9mm(會隨著不同螢幕大小有所不同),這是一般使用這使用touch screen感覺比較舒適的大小範圍內(7-10mm),所以Android希望盡量使用這種黃金比例的設計方式。範例如下:
建議每個UI的space距離是8dp
其實看到這裡,我還是似懂非懂,只是似乎有一個概念而已,但是dpi、dp還是傻傻分不清楚,不過Android Developer有更進一步關於支援Multiple Screens的介紹:http://developer.android.com/guide/practices/screens_support.html
在開始前,可能需要了解一下下面的專有名詞和觀念,由於我加入很多我認為的白話語解釋,有錯請指教。
Screen size
螢幕實際的大小,測量方式是以斜對角(diagonal)的方式,應該就是我們一般說的幾吋螢幕的手機,像我的One S是4.3吋,一般分成small, normal, large, and extra large這四種大小。
Screen density
度量單位是dpi (dots per inch),也就是每一吋裡有幾個點,也可以說有幾個pixels,一般分成low, medium, high, and extra high這四種。
補充:計算公式如下(2014.07.31)
以我的One S來說,4.3 吋 AMOLED,解析度960 x 540 (qHD)其dpi為
sqrt(960^2+540^2)/4.3 = 256.1419..... 介於hdpi(240)~xhdpi(320)之間,所以dpi是240
這裡ppi翻譯成pixels per inch其實是跟dpi(dot per inch)是一樣的。
Orientation
指的就是目前手機是橫向(landscape)還是直立(portrait)的。
Resolution
指的就是實際一個Screen上總共有多少個pixels,但APP設計時不能直接用resolution來設計,需要用screen size和screen density的角度來考量。
Density-independent pixel (dp)
是設計UI layout時所使用的一個虛擬的pixel unit,用來表達layout的尺寸(dimensions)或位置(position)。
density-independent pixel代表一個實體的pixel在160dpi的screen,所以公式如下:
px = dp * (dpi / 160)
舉例來說一個240dpi的screen,1dp就等於1.5pixcel,當在設計APP的UI時,要時時刻刻使用dp來做為設計的單位,確保你的UI可以在不同的密度下做呈現。
補充:mdpi: 1px = 1dp; hdpi: 1.5px = 1dp; xhdpi: 2px = 1dp; xxhdpi: 3px = 1dp (2014.07.30)
資料來源:http://petrnohejl.github.io/Android-Cheatsheet-For-Graphic-Designers/
我是覺得不知道是不是可以解釋成無關密度的意思,有點類似把相對位置變成絕對位置。
所以總結上述一些觀念:
為了解決不同device有不同的螢幕大小,從Android1.6(API Level 4)開始支援multiple screen的size與densities來對應不同的螢幕設定,因此就有以下兩個集合(Set)
size:small、normal、large和xlarge
註:從Android 3.2(API Level 13)開始支援平板,因此定義又不太一樣,可以參閱Declaring Tablet Layouts for Android 3.2,目前先針對Phone的部分看,Tablet以後有時間再研究。
densities:ldpi (low), mdpi (medium), hdpi (high), and xhdpi (extra high)
以下是一張很初淺的size和densities的對照圖,不是絕對:
以下則是每個size相對應的dp
- xlarge screens are at least 960dp x 720dp
- large screens are at least 640dp x 480dp
- normal screens are at least 470dp x 320dp
- small screens are at least 426dp x 320dp
補充:手機、平版的解析度(Resolution)和尺寸(Inch)百百種,怎樣才能快速方便之道你測試的設備是屬於哪種?這時你就可以使用Android提供的API來取得(2014.08.11)
int width = getResources().getDisplayMetrics().widthPixels; //手機或平板的寬度(pixel) int height = getResources().getDisplayMetrics().heightPixels; //手機或平板的高度(pixel) float density = getResources().getDisplayMetrics().density; //手機或平板的密度 float dpi = getResources().getDisplayMetrics().densityDpi; //手機或平板的dpi
等抓到測試設備的dpi後就可以直接對照上面2014.7.30補充的那張對照表,或者直接加入下列程式直接印出
if(dpi < 160){ //此為: ldpi } else if (mDpi < 240){ //此為: mdpi } else if (mDpi < 320){ //此為: hdpi } else if (mDpi < 480){ //此為: xhdpi } else { //此為: xxhdpi }
最後,開發的時候要顧到目前最多人使用的Android版本,因此官方提供一個隨時可以看目前Android版本的分布狀況(2014.08.22)
http://developer.android.com/about/dashboards/index.html
以及不同的resolution使用分布情形
像我Android SDK就只安裝最多人使用的那幾個版本,而不是全部都裝....
而且由上圖可以觀察到Normal(3吋到5吋)的手機似乎還是佔比較多數,且解析度似乎平均落在mdpi, hdpi, xhdpi, xxhdpi之間
因此在製作images時,就必須考慮這幾種解析度的圖片。
Place your comment