android ui布局适配,Android适配全面总结(一)----屏幕适配
前言
Android適配是一個老生常談的問題,很多程序員覺得很惡心,不愿意做適配,但是又不得不做。然后老板說,這位兄弟,做好了,今天晚飯給你加個雞腿,然后程序員開始找各種資料,忙活起來了,最終在苦逼的煎熬中做完了。
好了,言歸正傳,根據(jù)多年開發(fā)經(jīng)驗,總結(jié)一下Android適配主要表現(xiàn)在以下 3個方面:1、屏幕適配。(網(wǎng)上講的最多的就是這個。) 由于Android碎片化嚴(yán)重,導(dǎo)致開發(fā)中一套代碼在不同手機(jī)上運(yùn)行起來效果不是很好,兼容性不是很好,這就需要對不同分辨率,不同屏幕大小的手機(jī)做屏幕適配。
2、版本適配。 不同的系統(tǒng)版本api有所變更,既要適配高版本,也要做到兼容低版本。
3、ROM適配。(這個是最難的,工作量也是最大的,如果沒有不同版本手機(jī)適配的積累,遇到問題都不知道怎么解決。) 由于Android是開源的,不同的手機(jī)廠商有自己定制的ROM,對系統(tǒng)的api可能有變更,也有可能新增一些api,所以在開發(fā)中,要針對不同廠商的手機(jī)做一些特殊適配。
廢話少說,開始進(jìn)入正題。這篇文章我們先講解第一個問題 ---- 屏幕適配。
一、屏幕適配是啥(可能有人不懂,我在此簡單解釋一下)?程序猿把設(shè)計獅制作的效果圖應(yīng)用到不同的手機(jī),對不同的屏幕進(jìn)行界面調(diào)整的過程,確保界面不變形,呈現(xiàn)效果圖的位置、尺寸、比例。
二、需要掌握的幾個知識點(diǎn)。(1)屏幕物理尺寸:
屏幕對角線的尺寸。單位是英寸,1英寸 ≈ 2.54厘米比如常見的屏幕尺寸有5.0、5.1、5.2、5.5、5.7、5.9、6.0等(2)屏幕分辨率:定義:
確定計算機(jī)屏幕上顯示多少信息的設(shè)置,以水平和垂直像素來衡量。
計算公式:屏幕分辨率?=?橫向像素*縱向像素(或者?寬x高),如?1080*1920單位:
單位是px,1px=1個像素點(diǎn)。
常見分辨率:720x1280、1080x1920(當(dāng)然還有480x800,這個很少見了)(3)屏幕像素密度(dots per inch)含義:每英寸上的像素點(diǎn)數(shù)。
屏幕像素密度與屏幕尺寸和屏幕分辨率有關(guān),在單一變化條件下,屏幕尺寸越小、分辨率越高,像素密度越大,反之越小。
單位:dpi(dots per inch)
假設(shè)設(shè)備內(nèi)每英寸有240個像素,那么該設(shè)備的屏幕像素密度=240dpi
不同手機(jī)屏幕大小對應(yīng)的屏幕像素密度關(guān)系表:密度類型代表的分辨率(px)屏幕像素密度(dpi)低密度(ldpi)240x320120
中密度(mdpi)320x480160
高密度(hdpi)480x800240
超高密度(xhdpi)720x1280320
超超高密度(xxhdpi)1080x1920480當(dāng)然與像素有關(guān)的還有一個單位ppi,這個我們安卓中用不到,有興趣的可以百度一下。(4)以上三者(屏幕尺寸、分辨率、像素密度)之間的關(guān)系
屏幕尺寸、分辨率、像素密度之間的換算圖(5)密度無關(guān)像素(dp 或 dip)單位:dp,可以保證在不同屏幕像素密度的設(shè)備上顯示相同的效果
Android開發(fā)設(shè)置布局和控件寬高,用dp而不是px,dp是Android特有的單位
dp與px的轉(zhuǎn)換
因為ui給的圖是以 px 為單位的,Android開發(fā)則是使用 dp 作為單位的,那么我們需要進(jìn)行轉(zhuǎn)換:
在Android中,規(guī)定以160dpi(即屏幕分辨率為320x480)為基準(zhǔn):1dp=1px
(6)獨(dú)立比例像素(sp)單位:sp
Android開發(fā)時用sp設(shè)置文字大小,使用它可以根據(jù)文字大小首選項進(jìn)行放縮。
不推薦使用奇數(shù)和小數(shù),容易造成精度的丟失問題;小于12sp的字體會太小導(dǎo)致用戶看不清。
下面給一個實(shí)例說明,讓你更能明白這幾個單位:
看下圖你可以知道:為什么使用了dp作為單位,兩個手機(jī)分辨率也是一樣的,可是按鈕顯示的寬度還是不一樣?
三、屏幕適配的本質(zhì)
總結(jié)一下,主要有以下兩點(diǎn):(1)使得“布局”、“布局組件”、“圖片資源”、“用戶界面流程”匹配不同的屏幕尺寸
(2)使得“圖片資源”匹配不同的屏幕密度
四、屏幕適配具體的解決方案
首先看一張圖:
屏幕適配 具體實(shí)現(xiàn)方式
4.1 屏幕尺寸適配4.1.1.布局適配4.1.1.1. 使得布局元素自適應(yīng)屏幕尺寸
解決方案:使用相對布局(RelativeLayout),禁用絕對布局(AbsoluteLayout)。這個很基礎(chǔ),就不多說了。4.1.1.2. 根據(jù)屏幕的配置來加載相應(yīng)的UI布局。為不同屏幕尺寸的設(shè)備設(shè)計不同的布局。
解決方案:使用限定符。通過配置限定符使得程序在運(yùn)行時根據(jù)當(dāng)前設(shè)備的配置(屏幕尺寸)自動加載合適的布局資源。
限定符分類:
(1)尺寸(size)限定符(這種方式只適合Android 3.2版本之前)
res目錄新建一個layout-large文件夾,布局名字和res/layout里面的同名。在平板電腦和電視的屏幕(>7英寸)上:實(shí)施 雙面板 模式以同時顯示更多內(nèi)容,它會加載res/layout-large里面的布局,在手機(jī)較小的屏幕上:使用 單面板 分別顯示內(nèi)容,加載的是res/layout里面的同名布局。
尺寸(size)限定符
(2)最小寬度(Smallest-width)限定符。
通過指定某個最小寬度(以 dp 為單位)來精確定位屏幕從而加載不同的UI資源。(適用于Android 3.2及之后版本)
最小寬度限定符可讓您通過指定某個最小寬度(以 dp 為單位)來定位屏幕。例如,標(biāo)準(zhǔn) 7 英寸平板電腦的最小寬度為 600 dp,因此如果您要在此類屏幕上的用戶界面中使用雙面板(但在較小的屏幕上只顯示列表),您可以使用上文中所述的單面板和雙面板這兩種布局,但您應(yīng)使用 sw600dp 指明雙面板布局僅適用于最小寬度為 600 dp 的屏幕,而不是使用 large 尺寸限定符。
最小寬度(Smallest-width)限定符
(3)布局別名
為了解決文件名的重復(fù)從而帶來一些列后期維護(hù)的問題,我們使用 布局別名 方案。
通過以上兩點(diǎn),大家也會發(fā)現(xiàn)一個問題:
適配手機(jī)沒問題。但是適配平板發(fā)現(xiàn)Android3.2前后的這兩個文件內(nèi)容是一樣的,只是文件名不同而已。適配手機(jī)的單面板(默認(rèn))布局:res/layout/main.xml
適配尺寸>7寸平板的雙面板布局(Android?3.2前):res/layout-large/main.xml
適配尺寸>7寸平板的雙面板布局(Android?3.2后)res/layout-sw600dp/main.xml
解救方案:取一個別名就好了,示例如下:
布局別名
這樣兩個layout.xml都只是引用了@layout/main_twopanes,就避免了重復(fù)定義布局文件的情況
(4)屏幕方向(Orientation)限定符。
根據(jù)屏幕方向進(jìn)行布局的調(diào)整。
某些布局會同時支持橫向模式和縱向模式,但我們可以通過調(diào)整優(yōu)化其中大部分布局的效果。每種屏幕尺寸和屏幕方向下的布局行為方式如下所示:小屏幕,縱向:單面板,帶徽標(biāo)
小屏幕,橫向:單面板,帶徽標(biāo)
7 英寸平板電腦,縱向:單面板,帶操作欄
7 英寸平板電腦,橫向:雙面板,寬,帶操作欄
10 英寸平板電腦,縱向:雙面板,窄,帶操作欄
10 英寸平板電腦,橫向:雙面板,寬,帶操作欄
電視,橫向:雙面板,寬,帶操作欄
解決方案:
第一步:先定義類別:單/雙面板、是否帶操作欄、寬/窄定義在?res/layout/?目錄下的某個?XML?文件中
第二步:再進(jìn)行相應(yīng)的匹配:屏幕尺寸(小屏、7寸、10寸)、方向(橫、縱)使用布局別名進(jìn)行匹配
示例代碼如下圖所示:
屏幕方向(Orientation)限定符
這里沒有完全把全部尺寸匹配類型的代碼貼出來,大家可以自己去嘗試把其補(bǔ)充完整。4.1.2. 布局組件適配
使得布局組件自適應(yīng)屏幕尺寸。解決方案:使用"wrap_content"、"match_parent"和"weight“來控制視圖組件的寬度和高度。這個很基礎(chǔ),這幾個的用法大家應(yīng)該都經(jīng)常用的,就不多說了。4.1.3. 圖片資源適配
使得圖片資源在不同屏幕密度上顯示相同的像素效果。
在實(shí)際開發(fā)中一個按鈕的背景圖片必須能夠隨著按鈕大小的改變而改變。使用普通的圖片將無法實(shí)現(xiàn)這個效果,因為運(yùn)行時會對圖片均勻地拉伸或壓縮。解決方案:使用自動拉伸位圖(nine-patch圖片),后綴名是.9.png,它是一種被特殊處理過的PNG圖片,設(shè)計時可以指定圖片的拉伸區(qū)域和非拉伸區(qū)域;使用時,系統(tǒng)就會根據(jù)控件的大小自動地拉伸你想要拉伸的部分。
注意事項:1.必須使用UI給的圖片格式(.9.png后綴),隨意更改后綴使用在項目中會報錯,因為系統(tǒng)就是根據(jù)這個來區(qū)別nine-patch圖片和普通的PNG圖片的。
2.部分nine-patch圖片在Android Studio項目中不能識別,會報錯,需要謹(jǐn)慎使用。
下面一張圖看看使用nine-patch圖片的效果:
使用 nine-patch 圖片的效果
nine-patch圖片制作請參考我的博客:
nine-patch圖片的制作4.1.4. 用戶界面流程適配
根據(jù)屏幕的配置來加載相應(yīng)的用戶界面流程。使用場景:我們會根據(jù)設(shè)備特點(diǎn)顯示恰當(dāng)?shù)牟季?#xff0c;但是這樣做,會使得用戶界面流程可能會有所不同。
例如:如果應(yīng)用處于雙面板模式下,點(diǎn)擊左側(cè)面板上的項即可直接在右側(cè)面板上顯示相關(guān)內(nèi)容;而如果該應(yīng)用處于單面板模式下,點(diǎn)擊相關(guān)的內(nèi)容應(yīng)該跳轉(zhuǎn)到另外一個Activity進(jìn)行后續(xù)的處理。
解決方案(最終目的是進(jìn)行用戶界面流程的自適應(yīng)配置,其實(shí)就是用java代碼動態(tài)加載):
① 確定當(dāng)前布局。示例如下:
由于每種布局的實(shí)施都會稍有不同,因此我們需要先確定當(dāng)前向用戶顯示的布局。
例如,我們可以先了解用戶所處的是“單面板”模式還是“雙面板”模式。
確定當(dāng)前布局
② 根據(jù)當(dāng)前布局做出響應(yīng)。示例如下:
有些操作可能會因當(dāng)前的具體布局而產(chǎn)生不同的結(jié)果。
例如,在新聞閱讀器示例中,如果用戶界面處于雙面板模式下,那么點(diǎn)擊標(biāo)題列表中的標(biāo)題就會在右側(cè)面板中切換到相應(yīng)報道(Fragment);但如果用戶界面處于單面板模式下,那么上述操作就會啟動一個獨(dú)立Activity:
根據(jù)當(dāng)前布局做出響應(yīng)
③ 重復(fù)使用其他 Activity 中的 Fragment。示例如下:
例如,在新聞閱讀器示例中,對于較大的屏幕,新聞報道文本會顯示在右側(cè) Fragment 面板中;但對于較小的屏幕,這些文本就會以獨(dú)立 Activity 的形式存在。
重復(fù)使用其他 Activity 中的 Fragment
④ 處理屏幕配置變化。示例如下:
如果我們使用獨(dú)立Activity實(shí)施界面的獨(dú)立部分,那么請注意,我們可能需要對特定配置變化(例如屏幕方向的變化)做出響應(yīng),以便保持界面的一致性。
例如,在運(yùn)行 Android 3.0 或更高版本的標(biāo)準(zhǔn) 7 英寸平板電腦上,如果新聞閱讀器示例應(yīng)用運(yùn)行在縱向模式下,就會在使用獨(dú)立Activity 顯示新聞報道;但如果該應(yīng)用運(yùn)行在橫向模式下,就會使用雙面板布局。
處理屏幕配置變化
4.2 屏幕密度適配4.2.1.布局控件適配
使得布局組件在不同屏幕密度上顯示相同的像素效果。
解決方案有以下兩種:(1)使用 密度無關(guān)像素 ( dp ) 或 獨(dú)立比例像素( sp ) 作為計量單位。1.?使用dp來代替px作為控件寬高的統(tǒng)一度量單位。
2.?使用sp作為文字的統(tǒng)一度量單位。使用場景:假如同樣都是畫一條長度是屏幕一半的線,如果使用px作為計量單位,那么在480x800分辨率手機(jī)上設(shè)置應(yīng)為240px;在320x480的手機(jī)上應(yīng)設(shè)置為160px,二者設(shè)置就不同了;如果使用dp為單位,在這兩種分辨率下,160dp都顯示為屏幕一半的長度。
dp 和 px 的轉(zhuǎn)換在前面有介紹,這里就不說了。
為了能夠進(jìn)行不同屏幕像素密度的匹配,應(yīng)該這樣做:
有下面一種場景:
RelativeLayout布局里面,水平方向上放置兩個按鈕,一個是150dp左對齊,另外一個是200dp右對齊。在屏幕總寬度為360dp的Nexus5上中間有10dp的間隙。但同樣地設(shè)置在Nexus S(屏幕寬度是320dp),會發(fā)現(xiàn),兩個按鈕會重疊,因為320dp<200+150dp。
如圖:
Nexus5 效果
Nexus S 效果
從上面可以看出,由于Android屏幕設(shè)備的多樣性,如果使用dp來作為度量單位,并不是所有的屏幕的寬度都具備相同的dp長度。
dp解決了同一數(shù)值在 不同分辨率 中展示 相同尺寸大小 的問題(即屏幕像素密度匹配問題),但卻沒有解決設(shè)備 尺寸大小匹配 的問題。(即屏幕尺寸匹配問題)。注意:屏幕寬度和像素密度沒有任何關(guān)聯(lián)關(guān)系。(2)使用像素作為計量單位,采用百分比布局。從上面案例看出,因為屏幕密度(分辨率)不一樣,所以不能用固定的px;因為屏幕寬度不一樣,所以要小心的用dp。
因為本質(zhì)上是希望使得布局組件在不同屏幕密度上顯示相同的像素效果,那么,之前是繞了個彎使用dp解決這個問題,那么到底能不能直接用px解決呢?當(dāng)然是可以的。根據(jù)不同屏幕密度,控件選擇對應(yīng)的像素值大小。解決方法是: 百分比適配。
先說一下缺點(diǎn):
使用像素作為計量單位的適配方式,應(yīng)該能進(jìn)行90%的適配了,但其 缺點(diǎn) 還是很明顯:1.由于實(shí)際上還是使用px作為長度的度量單位,所以和google的要求使用dp作為度量單位會有所背離
2.必須盡可能多的包含所有分辨率,因為這個是使用這個方案的基礎(chǔ),如果有某個分辨率缺少,將無法完成該屏幕的適配
3.過多的分辨率像素描述xml文件會增加軟件包的大小和維護(hù)的難度
1.以某一分辨率為基準(zhǔn),生成所有分辨率對應(yīng)像素數(shù)列表
現(xiàn)在我們以320x480的分辨率為基準(zhǔn):
將屏幕的寬度分為320份,取值為x1x320,將屏幕的高度分為480份,取值為y1y480
然后生成該分辨率對應(yīng)像素數(shù)的列表,如下圖:
基準(zhǔn)分辨率像素列表
找到基準(zhǔn)后,是時候把其他分辨率補(bǔ)全了,以下是以1080x1920的分辨率為例:
關(guān)于自動生成values文件夾,這里推薦兩個工具:
① AndroidPixelDimenGenerator ,使用方式可以百度一下,這不是本文的重點(diǎn)。
② 張鴻洋大神寫的autolayout.jar這個工具,下載地址請點(diǎn)此 ,使用方法如下圖所示:
自動生成values文件夾以及對應(yīng)的dimens.xml文件.gif
2.將生成像素數(shù)列表存放在res目錄下對應(yīng)的values文件下,這個步驟上面的動態(tài)圖已經(jīng)做了。
注意事項:(1)對應(yīng)分辨率的資源文件應(yīng)放在res/values對應(yīng)的文件夾中。比如分辨率為1920x1080的資源文件應(yīng)放在res/values-1920x1080文件夾中。
(2)必須在默認(rèn)values里面也創(chuàng)建對應(yīng)默認(rèn)lay_x.xml和lay_y.xml文件,只是單位是dp。如果默認(rèn)values文件夾沒有(即沒有對應(yīng)的分辨率、沒有對應(yīng)dimen)就會報錯,從而無法進(jìn)行屏幕適配。
3.根據(jù)UI設(shè)計師給出設(shè)計圖上的尺寸,找到對應(yīng)像素數(shù)的單位,然后設(shè)置給控件即可。如下圖:????
android:layout_gravity="center"
android:gravity="center"
android:text="@string/hello_world"
android:layout_width="@dimen/x160"
android:layout_height="@dimen/y160"/>
4.2.2.圖片資源適配使得圖片資源在不同屏幕密度上顯示相同的像素效果。解決方案:提供備用位圖(符合屏幕尺寸的圖片資源)
常見做法步驟如下:
1.根據(jù)以下尺寸范圍針對各密度生成相應(yīng)的圖片:(一套分辨率設(shè)計一套位圖資源)
谷歌官方給出的屏幕密度對應(yīng)的圖標(biāo)尺寸對照表
比如說,如果我們?yōu)?xxhdpi 設(shè)備生成了144144 px尺寸的圖片,就應(yīng)該按照相應(yīng)比例地為 hdpi、xhdpi 和 xxhdpi 設(shè)備分別生成 7272 px 、9696 px 和 192192 px 尺寸的圖片。
2.將生成的圖片文件放在 res/ 下的相應(yīng)子目錄中(mdpi、hdpi、xhdpi、xxhdpi),系統(tǒng)就會根據(jù)運(yùn)行您應(yīng)用的設(shè)備的屏幕密度自動選擇合適的圖片。
3.通過引用 @drawable/id,系統(tǒng)都能根據(jù)相應(yīng)屏幕的 屏幕密度(dpi)自動選取合適的位圖。注意事項:1.如果是.9圖或者是不需要多個分辨率的圖片,放在drawable文件夾即可。
2.對應(yīng)分辨率的圖片要正確的放在合適的文件夾,否則會造成圖片拉伸等問題。圖片資源適配的 缺點(diǎn):1.?每套分辨率出一套圖,為美工或者設(shè)計增加了許多工作量
2.?對Android工程文件的apk包變的很大稍微優(yōu)化一下:有沒有一種方法,保證屏幕密度適配,可以最小占用設(shè)計資源,使得apk包不變大(只使用一套分辨率的圖片資源)?下面我們就來介紹這個方法:
只需選擇唯一一套分辨率規(guī)格的圖片資源。
xhdpi 應(yīng)該是首選。目前市面上最普遍的高端機(jī)的分辨率還多集中在720X1080范圍內(nèi)(xhdpi),所以目前來看xhpdi規(guī)格的圖片資源成為了首選。
動態(tài)設(shè)置屬性,做到完美適配:
① 給ImageView設(shè)置不同的ScaleType屬性會得到不同的顯示效果,一般情況下,設(shè)置為centerCrop能獲得較好的適配效果。
② 有些情況下,我們需要動態(tài)的設(shè)置控件大小或者是位置,比如說popwindow的顯示位置和偏移量等。這時我們可以動態(tài)獲取當(dāng)前的屏幕屬性,然后設(shè)置合適的數(shù)值。public?class?ScreenSizeUtil?{
public?static?int?getScreenWidth(Activity?activity)?{
return?activity.getWindowManager().getDefaultDisplay().getWidth();
}
public?static?int?getScreenHeight(Activity?activity)?{
return?activity.getWindowManager().getDefaultDisplay().getHeight();
}
}
③.使用第三方的屏幕適配框架。
總結(jié)
以上是生活随笔為你收集整理的android ui布局适配,Android适配全面总结(一)----屏幕适配的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 内存颗粒:从传统束缚到技术革新
- 下一篇: 内存条频率高,系统速度提升飞起