Android AutoLayout 全新的適配方式，堪稱適配終結者
一、概述
相信Android的開發者對於適配問題都比較苦惱，Google官方雖然給出了一系列的建議，但是想要單純使用這些建議將裝置很輕鬆的做好，還是相當困難的。個人也比較關注適配的問題，之前也發了幾篇關於適配的文章，大致有：
ok，我大致說一下，沒看過的先看完這篇，再考慮看不看以上幾篇，本篇的靈感是來自以上幾篇，但是適配的方便程度、以及效果遠比上面幾篇效果要好。
既然靈感來源於上述幾篇，就大體介紹下：
- 第一篇：主要是根據設計圖的尺寸，然後將設計圖上標識的px尺寸，轉化為百分比，為所有的主流螢幕去生成對應百分比的值，每個尺寸都會有一個values資料夾。存在一些問題：產生大量的資料夾，適配不了特殊的尺寸（必須建立預設的資料夾）
- 第二篇和第三篇：這兩篇屬於一樣的了，主要是基於Google推出的百分比佈局，已經很大程度解決了適配的問題。存在一些問題：使用起來比較反人類，因為設計圖上標識的都是px，所以需要去計算百分比，然後這個百分比還是依賴父容器的，設計圖可能並不會將每個父容器的尺寸都標識出來，所有很難使用（當然，有人已經採用自動化的工具去計算了）。還有個問題就是，因為依賴於父容器，導致ScrollView，ListView等容器內高度無法使用百分比。
可以看到都存在一些問題，或多或少都需要進行一些額外的工作，然而我希望適配是這樣的：
- 拿到設計圖，meta資訊中填入設計圖的尺寸，然後不需要額外計算，佈局直接抄設計圖上的尺寸，不產生任何多餘的資原始檔，完成各種解析度的適配！
二、直觀的體驗
假設我們拿到一張設計圖：
這樣的設計圖開發中很常見吧，有些公司可能需要自己去測量。
按照我們的思想：
佈局直接抄設計圖上的尺寸
對於，新增旅客我們的佈局文庫應該這麼寫：
Java
RelativeLayout
android:layout_width="match_parent"
android:layout_height="86px"
android:layout_marginTop="26px"
android:background="#ffffffff">
ImageView
android:id="@+id/id_tv_add"
android:layout_width="34px"
android:layout_height="34px"
android:layout_gravity="center_vertical"
android:layout_marginLeft="276px"
android:layout_marginTop="26px"
android:src="@mipmap/add"
/>
TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="26px"
android:layout_toRightOf="@id/id_tv_add"
android:text="新增旅客"
android:textColor="#1fb6c4"
android:textSize="32px"
/>
RelativeLayout>
RelativeLayout android:layout_width="match_parent" android:layout_height="86px" android:layout_marginTop="26px" android:background="#ffffffff"> ImageView android:id="@+id/id_tv_add" android:layout_width="34px" android:layout_height="34px" android:layout_gravity="center_vertical" android:layout_marginLeft="276px" android:layout_marginTop="26px" android:src="@mipmap/add" /> TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerVertical="true" android:layout_marginLeft="26px" android:layout_toRightOf="@id/id_tv_add" android:text="新增旅客" android:textColor="#1fb6c4" android:textSize="32px" /> RelativeLayout>
來張組合圖，感受一下：
感受完了，想一想，按照這種方式去寫佈局你說爽不爽。
ok，那麼對於Item的佈局檔案，就是這麼寫：
Java
RelativeLayout
android:layout_width="match_parent"
android:layout_height="108px"
android:layout_marginTop="26px"
android:background="#ffffffff"
>
TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="22px"
android:layout_marginTop="16px"
android:text="王大炮 WANG.DAPAO"
android:textColor="#333"
android:textSize="28px"
/>
TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="16px"
android:layout_marginLeft="22px"
android:text="護照：G50786449"
android:textColor="#999"
android:textSize="26px"
/>
RelativeLayout>
RelativeLayout android:layout_width="match_parent" android:layout_height="108px" android:layout_marginTop="26px" android:background="#ffffffff" > TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="22px" android:layout_marginTop="16px" android:text="王大炮 WANG.DAPAO" android:textColor="#333" android:textSize="28px" /> TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:layout_marginBottom="16px" android:layout_marginLeft="22px" android:text="護照：G50786449" android:textColor="#999" android:textSize="26px" /> RelativeLayout>
看到這，我相信，你現在最大的疑問就是：你用的px，px能完成適配？搞笑吧？
那麼首先說一下：這個px並不代表1畫素，我在內部會進行百分比化處理，也就是說：720px高度的螢幕，你這裡填寫72px，佔據10%；當這個佈局檔案執行在任何解析度的手機上，這個72px都代表10%的高度，這就是本庫適配的原理。
接下來：看下不同解析度下的效果：
768*1280,Andriod 4.4.4
480*800,Android 2.3.7
上述兩個機器的解析度差距相當大了，按照百分比的規則，完美實現了適配，最為重要的是：
- 再也不用拿著設計稿去想這控制元件的寬高到底取多少dp
- 再也不用去為多個螢幕去寫多個dimens
- 再也不用去計算百分比了（如果使用百分比控制元件完成適配）
- 再也不用去跟UI MM去解釋什麼是dp了
接下來說下用法。
本庫的地址： https://github.com/hongyangAndroid/AndroidAutoLayout
三、用法
用法
（1）註冊設計圖尺寸
將 autolayout 引入
Java
meta-data android:name="design_width" android:value="768">meta-data> meta-data android:name="design_height" android:value="1280">meta-data>
meta-dataandroid:name="design_width"android:value="768">meta-data> meta-dataandroid:name="design_height"android:value="1280">meta-data>
對於eclipse的夥伴，只有去copy原始碼了~~
在你的專案的AndroidManifest中註明你的設計稿的尺寸。
Java
meta-data android:name="design_width" android:value="768">meta-data> meta-data android:name="design_height" android:value="1280">meta-data>
meta-dataandroid:name="design_width"android:value="768">meta-data> meta-dataandroid:name="design_height"android:value="1280">meta-data>
（2）Activity中開啟設配
- 讓你的Activity去繼承AutoLayoutActivity
ok，非常簡單的兩部即可引入專案，然後，然後幹嘛？
然後就按照上個章節的編寫方式開始玩耍吧~
ok，上面是最簡單的用法，當然你也可以不去繼承AutoLayoutActivity來使用。
AutoLayoutActivity的用法實際上是完成了一件事：
- LinearLayout -> AutoLinearLayout
- RelativeLayout -> AutoRelativeLayout
- FrameLayout -> AutoFrameLayout
如果你不想繼承AutoLayoutActivity，那麼你就得像Google的百分比庫一樣，去用AutoXXXLayout代替系統原有的XXXLayout。當然，你可以放心的是，所有的系統屬性原有的屬性都會支援，不過根佈局上就不支援px的自動百分比化了，但是一般根佈局都是MATCH_PARENT，而上述的方式，根佈局也是可以直接px的百分比化的。
四、注意事項
（1）如何開啟PreView
大家都知道，寫佈局檔案的時候，不能實時的去預覽效果，那麼體驗真的是非常的不好，也在很大程度上降低開發效率，所以下面教大家如何用好，用對PreView（針對該庫）。
首先，你要記得你設計稿的尺寸，比如768 * 1280
然後在你的PreView皮膚，選擇解析度一致的裝置：
然後你就可以看到最為精確的預覽了：
兩個注意事項：
- 你們UI給的設計圖的尺寸並非是主流的設計圖，該尺寸沒找到，你可以
拿顯示器砸他自己去新建一個裝置。 - 不要在PreView中去檢視所有解析度下的顯示，是看不出來適配效果的，因為有些計算是動態的。
(2)關於TextView
TextView這個控制元件呢，可能和設計稿上會有一些出入，並非是此庫的原因，而是與生俱來的特性。
比如：
Java
TextView textSize="32px" layout_height="wrap_contnt" />
TextView textSize="32px" layout_height="wrap_contnt" />
你去執行肯定不是32px的高度，文字的上下方都會有一定的空隙。如何你將高度寫死，也會發現文字顯示不全。
恩，所以呢，靈活應對這個問題，對於存在字型標識很精確的值，你可以選擇：對於TextView與其他控制元件的上下邊距呢，儘可能的稍微寫小一點。
其實我上面的例子，幾乎都是TextView，所有我在編寫Item裡面的時候，也有意縮小了一下marginTop值等。不過，對於其他控制元件是不存在這樣的問題的。
ps:因為TextView的上述問題：所以對於居中，雖然可以使用本庫通過編寫margin_left,margin_top等很輕鬆的完成居中。但是為了精確起見，還是建議使用gravity，centerInXXX等屬性完成。
(3) 指定設定的值參考寬度或者高度
由於該庫的特點，佈局檔案中寬高上的1px是不相等的，於是如果需要寬高保持一致的情況，佈局中使用屬性：
app:layout_auto_basewidth=”height”，代表height上編寫的畫素值參考寬度。
app:layout_auto_baseheight=”width”，代表width上編寫的畫素值參考高度。
如果需要指定多個值參考寬度即：
app:layout_auto_basewidth="height|padding"
用|隔開，類似gravity的用法，取值為：
- width,height
- margin,marginLeft,marginTop,marginRight,marginBottom
- padding,paddingLeft,paddingTop,paddingRight,paddingBottom
- textSize.
(4)將狀態列區域作為內容區域
如果某個Activity需要將狀態列區域作為實際的內容區域時，那麼可用高度會變大，你所要做的只有一件事：讓這個Activity實現UseStatusBar介面(僅僅作為標識左右，不需要實現任何方法)，當然你肯定要自己開啟windowTranslucentStatus或者設定FLAG_TRANSLUCENT_STATUS。
注意：僅僅是改變狀態列顏色，並不需要實現此介面，因為並沒有實際上增加可用高度。
五、其他
目前支援屬性
- layout_width
- layout_height
- layout_margin(left,top,right,bottom)
- pading(left,top,right,bottom)
- textSize
- 不會影響系統所有的其他屬性，以及不會影響dp,sp的使用
效能的提升
通過本庫的方式去編寫程式碼，可以在很大程式上使用margin，也就是說，對於View的位置非常好控制，從而能夠減少非常多的巢狀，甚至任何一個複雜的介面做到無巢狀。
以及，幾乎不需要去使用RelativeLayout的規則了，比如rightOf，完全可以由marginLeft完成，其他的rule同理。
對於LinearLayout的weight，幾乎也不需要使用了，比如螢幕寬度720px，想要四個控制元件橫向均分，完全可以寫layout_width=”180px”
我相信通過上述的介紹，你已經瞭解的本庫適配的做法，而且可以說是我見過的最方便的適配方案，最大化的減輕了適配的負擔，甚至比你不適配時編寫UI都方便。目前本庫，已經嘗試用於專案中，儘可能去發現一些潛在的問題。
本庫的地址： https://github.com/hongyangAndroid/AndroidAutoLayout ，歡迎各位一起完善，讓適配問題消失在我們的痛苦中。
ok，最後，只有去體驗了，才能發現優點和缺點~~
相關文章
- Android 螢幕適配終結者Android
- Flutter-國際化適配終結者Flutter
- Android適配: 拉伸適配的缺點Android
- (new)Flutter-國際化適配終結者Flutter
- Android適配Android
- android 螢幕適配一：通過自定義View的方式實現適配AndroidView
- Android APP全方位效能調優之螢幕適配終結者AndroidAPP
- Android 劉海屏適配總結Android
- Android 適配多種ROM的快捷方式Android
- Android 適配多種 ROM 的快捷方式Android
- android螢幕適配三：通過畫素密度適配Android
- Android螢幕適配（理論適配100%機型）Android
- Android華為凹口屏適配小結Android
- Android7.0的適配Android
- 苦逼的Android適配Android
- Android圖示適配Android
- Android 劉海屏適配Android
- Android P 適配指南Android
- android全面屏適配Android
- android 螢幕適配Android
- Android N 適配心得Android
- android 圖片適配Android
- flutter 螢幕尺寸適配 字型大小適配Flutter
- Android螢幕適配總結和思考Android
- Android技能樹 — 螢幕適配小結Android
- Android中的icon適配Android
- 設計模式-適配者模式設計模式
- Android Q 提前適配攻略Android
- Android適配：DP簡述Android
- Android6.0～9.0適配Android
- Android許可權適配Android
- Android 桌面角標的適配Android
- 關於 Android 狀態列的適配總結Android
- 移動端適配總結
- 前端iPhone X適配總結前端iPhone
- iphone 適配的sdkiPhone
- android螢幕適配的問題Android
- Flutter螢幕適配,簡單粗暴的全域性適配方式Flutter