此文章轉(zhuǎn)自:http://www.reibang.com/p/1302ad5a4b04
學(xué)習(xí)記錄使用取胎。
前言
網(wǎng)上關(guān)于屏幕適配的文章已經(jīng)鋪天蓋地了展哭,為什么我還要講湃窍?因?yàn)榫W(wǎng)上現(xiàn)在基本都是使用屏幕分辨率限定符進(jìn)行適配,即每種屏幕分辨率的設(shè)備需要定義一套 dimens.xml 文件匪傍。由于不同分辨率的設(shè)備太多了您市,而且有些設(shè)備還有虛擬按鍵(例如華為手機(jī)),這樣就還需要每個(gè)有虛擬按鍵的設(shè)備加多一套 dimens.xml 文件役衡,再加上平板那些你會(huì)發(fā)現(xiàn) dimens.xml 文件所占的體積已經(jīng)超過2M了茵休!這絕對(duì)不是我們想要的。
我這里要講的是使用sw<N>dp限定符手蝎,即 smallestWidth(最小寬度) 限定符來(lái)進(jìn)行適配榕莺,使用這種方式只需要少量 dimens.xml 文件即可達(dá)到適配,而且根本不用考慮虛擬按鍵的問題棵介。如果只適配手機(jī)钉鸯,dimens.xml 文件所占的體積只有 100 多 KB,即使加上平板和 TV邮辽,也就500多KB唠雕,完全可以接收。這種方案已經(jīng)在自己多個(gè)項(xiàng)目中應(yīng)用過了吨述,經(jīng)過幾十臺(tái)手機(jī)測(cè)試過及塘,基本不會(huì)出現(xiàn)適配有問題的情況。制作生成對(duì)應(yīng) dimens.xml 文件插件(后面會(huì)講)的作者也說過他在待過的兩家大公司實(shí)踐過锐极,所以請(qǐng)放心使用笙僚。
一、為什么要進(jìn)行屏幕適配灵再?
關(guān)于為什么要進(jìn)行屏幕適配肋层,什么是 dp、dpi 這些概念我就不去一一講解了翎迁,網(wǎng)上很多文章栋猖。這里我推薦幾篇講的比較好的:
Android屏幕適配全攻略(最權(quán)威的官方適配指導(dǎo))
二、屏幕分辨率限定符與 smallestWidth 限定符適配原理
2.1 屏幕分辨率限定符適配原理
屏幕分辨率限定符適配需要在 res 文件夾下創(chuàng)建各種屏幕分辨率對(duì)應(yīng)的 values-xxx 文件夾汪榔,如下圖:
然后根據(jù)一個(gè)基準(zhǔn)分辨率蒲拉,例如基準(zhǔn)分辨率為 1280x720,將寬度分成 720 份痴腌,取值為 1px~720px雌团,將高度分成 1280 份,取值為 1px~1280px士聪,生成各種分辨率對(duì)應(yīng)的 dimens.xml 文件锦援。如下分別為分辨率 1280x720 與 1920x1080 所對(duì)應(yīng)的橫向dimens.xml 文件:
假設(shè)設(shè)計(jì)圖上的一個(gè)控件的寬度為 720px,那么布局中就寫 android:layout_width="@dimen/x720" 剥悟,當(dāng)運(yùn)行程序的時(shí)候灵寺,系統(tǒng)會(huì)根據(jù)設(shè)備的分辨率去尋找對(duì)應(yīng)的 dimens.xml 文件曼库。例如運(yùn)行在分辨率為 1280x720 的設(shè)備上,系統(tǒng)會(huì)自動(dòng)找到對(duì)應(yīng)的 values-1280x720 文件夾下的 lay_x.xml 文件略板,由上圖可知 x720 對(duì)應(yīng)的值為
720.px毁枯,可鋪滿該屏幕寬度。運(yùn)行在分辨率為 1920x1080 的設(shè)備上叮称,系統(tǒng)會(huì)自動(dòng)找到對(duì)應(yīng)的 values-1920x1080 文件夾下的 lay_x.xml 文件后众,由上圖可知 x720 對(duì)應(yīng)的值為 1080.0px,可鋪滿該屏幕寬度颅拦。這樣就達(dá)到了屏幕適配的要求!
2.2 smallestWidth 限定符適配原理
smallestWidth 限定符適配原理與屏幕分辨率限定符適配原理一樣教藻,系統(tǒng)都是根據(jù)限定符去尋找對(duì)應(yīng)的 dimens.xml 文件距帅。例如程序運(yùn)行在最小寬度為 360dp 的設(shè)備上,系統(tǒng)會(huì)自動(dòng)找到對(duì)應(yīng)的 values-sw360dp 文件夾下的 dimens.xml 文件括堤。區(qū)別就在于屏幕分辨率限定符適配是拿 px 值等比例縮放碌秸,而 smallestWidth 限定符適配是拿 dp 值來(lái)等比縮放而已。需要注意的是“最小寬度”是不區(qū)分方向的悄窃,即無(wú)論是寬度還是高度讥电,哪一邊小就認(rèn)為哪一邊是“最小寬度”。如下分別為最小寬度為 360dp 與最小寬度為 640dp 所對(duì)應(yīng)的 dimens.xml 文件:
獲取設(shè)備最小寬度代碼為:
DisplayMetrics dm=newDisplayMetrics();getWindowManager().getDefaultDisplay().getMetrics(dm);intheightPixels=ScreenUtils.getScreenHeight(this);intwidthPixels=ScreenUtils.getScreenWidth(this);floatdensity=dm.density;floatheightDP=heightPixels/density;floatwidthDP=widthPixels/density;floatsmallestWidthDP;if(widthDP<heightDP){smallestWidthDP=widthDP;}else{smallestWidthDP=heightDP;}
ScreenUtils——>ScreenUtils
三轧抗、為什么選擇 smallestWidth 限定符適配恩敌?
既然原理都一樣,都需要多套 dimens.xml 文件横媚,那為什么要選擇 smallestWidth 限定符適配呢纠炮?
屏幕分辨率限定符適配是根據(jù)屏幕分辨率的,Android 設(shè)備分辨率一大堆灯蝴,而且還要考慮虛擬鍵盤恢口,這樣就需要大量的 dimens.xml 文件。因?yàn)闊o(wú)論手機(jī)屏幕的像素多少穷躁,密度多少耕肩,90% 的手機(jī)的最小寬度都為 360dp,所以采用 smallestWidth 限定符適配只需要少量 dimens.xml 文件即可问潭。
屏幕分辨率限定符適配采用的是 px 單位猿诸,而 smallestWidth 限定符適配采用的單位是 dp 和 sp,dp 和 sp 是google 推薦使用的計(jì)量單位狡忙。又由于很多應(yīng)用要求字體大小隨系統(tǒng)改變两芳,所以字體單位使用 sp 也更靈活。
屏幕分辨率限定符適配需要設(shè)備分辨率與 values-xx 文件夾完全匹配才能達(dá)到適配去枷,而 smallestWidth 限定符適配尋找 dimens.xml 文件的原理是從大往小找怖辆,例如設(shè)備的最小寬度為 360dp是复,就會(huì)先去找 values-360dp,發(fā)現(xiàn)沒有則會(huì)向下找 values-320dp竖螃,如果還是沒有才找默認(rèn)的 values 下的 demens.xml 文件淑廊,所以即使沒有完全匹配也能達(dá)到不錯(cuò)的適配效果。
四特咆、使用步驟
4.1 以設(shè)計(jì)圖最小寬度(單位為 dp)作為基準(zhǔn)值季惩,生成所有設(shè)備對(duì)應(yīng)的 dimens.xml 文件
這些文件當(dāng)然不會(huì)手動(dòng)去寫,網(wǎng)上已經(jīng)有大神提供了自動(dòng)生成這些文件的插件ScreenMatch腻格。但是這個(gè)插件還是有點(diǎn)問題的:
默認(rèn)沒有適配最小寬度為 320dp 的設(shè)備画拾。其實(shí)自己測(cè)試還是有很多設(shè)備最小寬度是 320dp 的,所以需要加上菜职。
最小寬度為 392.7272 與 411.4285 的手機(jī)不能達(dá)到完全適配青抛。原因是該插件的默認(rèn)值都是取整的,即 392.7272 與 411.4285 在插件中寫的是 392 與 411酬核。
基于以上問題蜜另,我在該插件的源碼上優(yōu)化生成了新的插件ScreenMatch,由于插件庫(kù)已經(jīng)有原作者的插件了嫡意,所以我就不重復(fù)造輪子上傳到插件庫(kù)了举瑰,你直接用本地安裝的方式安裝即可。
工具使用步驟:
在 Android Studio 中安裝 ScreenMatch 插件
下載插件ScreenMatch到本地蔬螟,點(diǎn)擊菜單欄上的 File -> Settings -> Plugins -> Install plugin from disk此迅,然后選擇我們剛剛下載的插件,最后點(diǎn)擊 “OK”旧巾,重啟 Andorid Studio 即可邮屁。如下圖所示:
在項(xiàng)目的默認(rèn) values 文件夾中需要一份 dimens.xml 文件
我在github 源碼已經(jīng)提供了一份,直接復(fù)制過來(lái)即可菠齿。
執(zhí)行生成
插件安裝好后佑吝,在項(xiàng)目的任意目錄或文件上右鍵,選擇 ScreenMatch 選項(xiàng)绳匀。如下圖:
然后選擇在哪個(gè) module 下執(zhí)行適配芋忿。即基于哪個(gè) module 下的 res/values/dimens.xml 文件作為基準(zhǔn) dimens.xml 文件,生成的其他尺寸 dimens.xml 文件放在哪個(gè) module 下疾棵。例如選擇 app戈钢,然后點(diǎn)擊 OK ,出現(xiàn)如下界面表示生成文件成功是尔。如下圖:
然后再看看 res 目錄下會(huì)自動(dòng)生成一堆 dimens.xml 文件殉了,如下圖:
通過上面的步驟就已經(jīng)生成了所有設(shè)備對(duì)應(yīng)的 dimens.xml 文件。
根據(jù)設(shè)計(jì)圖填寫最小寬度基準(zhǔn)值拟枚,并填寫需要適配的設(shè)備最小寬度 dp 值
步驟 3 是以插件默認(rèn)的最小寬度基準(zhǔn)值為 360dp薪铜,適配的設(shè)備最小寬度為
320,360,384,392.7272,400,410,411.4285,432,480,533,592,600,640,662,720,768,800,811,820,960,961,1024,1280,1365(包含了平板和 TV )生成的文件前方,但實(shí)際情況要根據(jù)設(shè)計(jì)圖和需求設(shè)置掂咒。
例如設(shè)計(jì)圖的最小寬度為 375dp,則需要更改最小寬度基準(zhǔn)值為 375dp。如果項(xiàng)目只需要適配手機(jī)的話逊桦,適配的設(shè)備最小寬度保留 320,360,384,392.7272,400,410,411.4285,432,480 即可哥蔚,若發(fā)現(xiàn)手機(jī)還有其他最小寬度自行加上即可岩调,也麻煩把該最小寬度提供給我得滤,我們一起來(lái)完善該份適配。
以上修改需要在配置文件里修改俯艰,即 screenMatch.properties 文件捡遍,該配置文件是執(zhí)行完上面第 3 步后自動(dòng)生成在項(xiàng)目的跟目錄下的。如下圖:
打開配置文件竹握,修改下圖中 1画株、3、4 的值即可涩搓。(圖中單位均為 dp)
1:最小寬度基準(zhǔn)值,填寫設(shè)計(jì)圖的最小寬度值即可劈猪。
2:插件默認(rèn)適配的最小寬度值昧甘,即默認(rèn)情況下會(huì)生成如下值的 dimens.xml 文件。
3:需要適配的最小寬度值(如果是小數(shù)战得,則保留4位小數(shù)充边。例如 392.727272...,則取 392.7272)常侦,即你想生成哪些 dimens.xml 文件浇冰。
4:忽略不需要適配的最小寬度值,即忽略掉插件默認(rèn)生成的 dimens.xml 文件聋亡。
配置文件修改完成后肘习,重新執(zhí)行第 3 步,生成新的 dimens.xml 文件坡倔。
當(dāng)然漂佩!如果你的設(shè)計(jì)圖也是標(biāo)準(zhǔn)的 360dp,那么上面的步驟你可以忽略罪塔。直接復(fù)制我 github 上你需要的 dimens.xml 文件到你的項(xiàng)目即可投蝉,默認(rèn)的 values 文件夾下也需要一份。
4.2 根據(jù)設(shè)計(jì)圖標(biāo)注征堪,在布局寫上對(duì)應(yīng)的值瘩缆。
設(shè)計(jì)圖標(biāo)注多少 dp,布局中就寫多少 dp 佃蚜,非常方便庸娱!
大多數(shù) UI 設(shè)計(jì)師提供設(shè)計(jì)圖有如下幾種方式:
上傳到藍(lán)湖:顯示多少 dp 就寫多少 dp着绊。
psd 源文件:用像素大廚查看,顯示多少 dp 就寫多少 dp(注意像素大廚需要選擇與設(shè)計(jì)圖對(duì)應(yīng)的dpi 進(jìn)行顯示)
dp 單位的設(shè)計(jì)圖:標(biāo)注多少 dp 就寫多少 dp涌韩。
px 單位的設(shè)計(jì)圖:叫 UI 設(shè)計(jì)師標(biāo)注為 dp 單位或跟她要 psd 源文件畔柔,如果都不行,那自己算吧臣樱!
舉例:例如設(shè)計(jì)圖上一個(gè)Button 的寬為 360dp靶擦,高為 50dp,字體大小為 15 sp雇毫,在布局中則這樣使用:
<Buttonandroid:layout_width="@dimen/dp_360"android:layout_height="@dimen/dp_50"android:textSize="@dimen/sp_15"/>
代碼中動(dòng)態(tài)設(shè)置 dp 或 sp:
如果需要在代碼中動(dòng)態(tài)設(shè)置 dp 或 sp玄捕,則需要通過 getDimension()方法獲取對(duì)應(yīng)資源文件下的 dp 或 sp 值再設(shè)置(具體參考 github 上的 demo)。如下:
/*獲取sp值*/floatpxValue=getResources().getDimension(R.dimen.sp_15);//獲取對(duì)應(yīng)資源文件下的sp值intspValue=ConvertUtils.px2sp(this,pxValue);//將px值轉(zhuǎn)換成sp值mTvShowParams.setTextSize(spValue);//設(shè)置文字大小/*獲取dp值*/floatpxValue2=getResources().getDimension(R.dimen.dp_360);//獲取對(duì)應(yīng)資源文件下的dp值intdpValue=ConvertUtils.px2dp(this,pxValue2);//將px值轉(zhuǎn)換成dp值
4.3 使用步驟總結(jié)
說了這么多棚放,其實(shí)只需要簡(jiǎn)單的 2 步:
以設(shè)計(jì)圖最小寬度(單位為 dp)作為基準(zhǔn)值枚粘,利用插件生成所有設(shè)備對(duì)應(yīng)的 dimens.xml 文件
根據(jù)設(shè)計(jì)圖標(biāo)注,標(biāo)注多少 dp飘蚯,布局中就寫多少dp馍迄,格式為@dimen/dp_XX。
五局骤、怎么適配其他 module?
問題:在項(xiàng)目的其他 module 中怎么實(shí)現(xiàn)適配攀圈?難道也要多套 dimens 文件?
解決:并不需要多套 dimens 文件峦甩,只需要在 values 文件夾下有一套與 app module 一樣的 dimens 文件即可達(dá)到適配赘来。因?yàn)榻?jīng)過編譯,所有 module 中的 dimen 數(shù)據(jù)都會(huì)統(tǒng)一歸類到主 module(即 app module)中的 values/dimens.xml 文件中了凯傲,然后系統(tǒng)又會(huì)根據(jù)你設(shè)置的值去找對(duì)應(yīng) values-swxxxdp 文件夾下的dimens.xml 文件中的值犬辰。
驗(yàn)證:將我 github 上的 demo 分別運(yùn)行在不同 widthDP 的設(shè)備上(用模擬器即可),然后觀察顯示的效果會(huì)發(fā)現(xiàn)確實(shí)是這樣的冰单。
六幌缝、常見問題匯總
6.1 為什么寬度適配了,高度有時(shí)候沒有完全適配诫欠?
因?yàn)楦鞣N屏幕高寬比并不是固定的狮腿,有16:9、4:3呕诉,還有全面屏的19.5:9等等缘厢,如果強(qiáng)行將寬高都適配那只會(huì)導(dǎo)致布局變形。
例如一個(gè)控件的寬高為360dp和640dp甩挫,如果將它顯示在寬高為360dp和640dp的設(shè)備上是正常鋪滿整個(gè)屏幕的贴硫,但是顯示在寬高為360dp和780dp的設(shè)備上高度則不能鋪滿,如果你讓高度鋪滿,而寬度又保持不變英遭,那就會(huì)出現(xiàn)變形的情況间护。所以這也就是為什么目前市面上的屏幕適配方案只能以寬或高一個(gè)維度去適配,另一個(gè)方向用滑動(dòng)或權(quán)重的方式去適配的原因挖诸。
那你為什么說高度也能適配呢汁尺?
這里說的高度也能適配指的是在不同分辨率和密度的手機(jī)上能達(dá)到等比縮放的適配,其他屏幕適配方案也是一樣的多律。
6.2 如何同時(shí)適配橫豎屏痴突?
方案一:(不推薦)
計(jì)算出設(shè)備寬度和高度的dp值,然后生成對(duì)應(yīng)的寬高 dimens.xml 文件狼荞。然后去掉所有 values-swXXXdp 目錄上的s辽装,即改為 values-wXXXdp。這樣設(shè)備不管橫豎屏都能找到對(duì)應(yīng)的 values-wXXXdp 目錄下的? dimens.xml 文件了相味。 雖然也能達(dá)到一定程度的適配拾积,但是這樣會(huì)增加很多 dimens.xml 文件,而且使用豎屏的設(shè)計(jì)圖顯示出來(lái)的效果也不夠好丰涉。
方案二:(推薦)
因?yàn)闄M屏?xí)r寬高變化太大拓巧,想要橫屏?xí)r也能完全適配,那就只能讓設(shè)計(jì)師出一套橫屏的設(shè)計(jì)圖一死,然后單獨(dú)寫一套橫屏的布局文件肛度。
注意:smallestWidth 限定符適配的效果是讓不同分辨率和密度的設(shè)備上能達(dá)到以設(shè)計(jì)圖等比縮放的適配,如果設(shè)備與設(shè)計(jì)圖相差太大時(shí)并不能達(dá)到很好的適配效果摘符,需要單獨(dú)出圖贤斜,其他屏幕適配方案也是一樣的策吠。
6.3 如何適配平板逛裤、TV?
同橫屏道理一樣猴抹,平板带族、TV 與手機(jī)的寬高差距太大,想要平板蟀给、TV 也能完全適配蝙砌,那就只能讓設(shè)計(jì)師出一套平板、TV 的設(shè)計(jì)圖跋理,然后單獨(dú)寫一套平板择克、TV 的布局文件。
注意:再說一遍前普,smallestWidth 限定符適配的效果是讓不同分辨率和密度的設(shè)備上能達(dá)到以設(shè)計(jì)圖等比縮放的適配肚邢,如果設(shè)備與設(shè)計(jì)圖相差太大時(shí)并不能達(dá)到很好的適配效果,需要單獨(dú)出圖,其他屏幕適配方案也是一樣的骡湖。
github 地址:ScreenAdaptation
參考資料:
Android屏幕適配全攻略(最權(quán)威的官方適配指導(dǎo))
Android dp方式的屏幕適配工具使用(Android Studio插件方式)
作者:wildma
鏈接:http://www.reibang.com/p/1302ad5a4b04
來(lái)源:簡(jiǎn)書
著作權(quán)歸作者所有贱纠。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處响蕴。