[Android] 滿足各種不同螢幕尺寸

Android因為為開放性,各家的手機業者都可以任意的開發屬於各家廠牌風格的手機,與提供了更多元的螢幕尺寸和不同的裝置外型,消費者可以依自己的需求與喜好選擇屬於自己個性的手機來使用,相反的,身為Android應用程式開發者,為了支持不同家手機與支援多種螢幕,比其它手機平台(iphone,windows phone)開發就相對滴辛苦些,因為要針對不同的尺寸大小螢幕去最佳化UI的擺設和大小,也就是如何設計Android UI 滿足各不同的螢幕尺寸?

首先,下面是有關於螢幕尺寸相關的名詞:

Screen size
    實際的螢幕尺寸大小
Screen density
    螢幕內物理面積的相素數量，通常表示為dpi(dot per inch)。
    低密度螢幕具有較少的像素，相較於中/高密度螢幕
Orientation
    直立/横式
Resolution
    螢幕中實際像素的總數.UI設計應該注意到的是螢幕的實際尺寸及密度，而不是解析度
Density-independent pixel (dp)
    一個虛擬像素單元, 用來設計UI佈局時，表達尺寸及位置的單元

官方也建議使用 px = dp * (dpi / 160)中的dp來表示螢幕元件的尺寸表示,

ex：寬度100dp的元件在HTC WildFire(120 dpi) 轉換後 75  px
                   HTC Desire  (240 dpi) 轉換後 150 px
    螢幕上 75/240 = 150/480 所以看起來都是佔了螢幕的1/3

在開發之前,先了解全世界的各種手機的螢幕解析度 : 螢幕解析度

另外,也了解目前Android主流的螢幕與核心版本 : 主流螢幕

另外,官方也提出建議,如何在開發一個支持不同螢幕尺寸的應用程式: Supporting Multiple Screens - Android Developer

也整理下列重點:

How to Support Multiple Screens





1.為了最佳化應用程式UI能符合不同的螢幕尺寸和密度，可以設計不同的圖片放在相對的目錄中


  ex: drawable-hdpi drawable-ldpi drawable-mdpi


2.讓系統來處理遇到不同尺寸的螢幕/密度該採用哪個圖片，達到最佳化效果


3.提供不同螢幕大小不同的佈局


  ex：layout-xlarge / layout-large / layout-normal / layout-small


4.若系統找不到適合的目錄，預設會取用 drawable , layout 目錄中的設定

Designing alternative layouts and drawables


設計Layout,一般來說，你可以利用AVD不同的螢幕大小來測試你是否需要設計不同的Layout,設計Drawable，請記得3:4:6:8 規則


ex：你針對中密度螢幕做了一個48x48像素的圖片,則各相對目錄的尺寸應該如下


  36x36 for low-density


  48x48 for medium-density


  72x72 for high-density


  96x96 for extra high-density

Best Practices

• 必須要針對不同的類型的螢幕來建立不同的資料檔，格式需為<resources_name>-<qualifier>，qualifier可以有多個，每一種qualifier要以”-“做區隔，且每一種qualifier要有順序性。這邊有個小心得分享給大家，那就是接下來Android 4.0 IceCreamSandwich就要大舉進攻了，qualifer方式可以多使用sw<N>dp，利用此種分類方式，可以減少多種qualifer的分支，像Sensation的sw<N>dp是sw360dp，Milestone是sw320dp，但兩種手機都屬於Normal Screen, hdpi的螢幕，可是兩支手機的解析度又不一樣，前者是960x540，後者是854x480，如此一來兩種手機上使用同一種layout.xml就會有UI不一致的問題。如果要開發Android 4.0以上的App可使用sw<N>dp的分類方式來設計Layout，但假如你觀看目前Android的使用者人數後，發現使用Android 2.1的人還是很多，但sw<N>dp這一類qualifier只能用在Android 3.2以上。此時可以改用<resources_name>-<960x540>這種分類方式來解決被歸類為相同螢幕尺寸大小和密度但確不同解析度的UI配置分類。



• 在XML佈局的設定中儘量使用 wrap_content, fill_parent或dp



• 不要再程式中寫入hard code固定的像素值



• 不要使用AbsoluteLayout



• 依密度/尺寸 設計不同的drawable及layout

部分內容參考自Android的學習流水帳 , [Android] - 支援多重螢幕設計)