一直以來都用px映射表來解決不同界面的適配性問題（參考：Android界面開發(fā)精要1：尺寸）尤仍。最近在一些設(shè)備上發(fā)現(xiàn)遍烦，這種方案也有弊端：以UI圖的基礎(chǔ)設(shè)計是基于720*1280（如Galaxy Nexus）為例，最近發(fā)現(xiàn)有些設(shè)備的像素寬高比并不是如此拨拓，比如Nexus 4就是768*1280肴颊。
這種情形下，不同的映射方式會有不同的效果：
-
采用Google提供的dp映射：就會發(fā)現(xiàn)空白區(qū)域變多渣磷，原本720的寬度應(yīng)該是滿屏婿着，現(xiàn)在就無法滿屏了，因為多出了48
720*1280在Nexus 4上 采用百分比來映射拉伸：會發(fā)現(xiàn)正方形的圖片醋界，變成了長方形竟宋。因為寬度和高度的比例變了，基于其推算出來的正方形寬高自然也就不準(zhǔn)了形纺。
仔細(xì)思考就會發(fā)現(xiàn)問題的本質(zhì)是：控件寬高計算基準(zhǔn)是不同的丘侠。
- “分辨率不同啊，不單獨適配了逐样，直接拉伸好了”蜗字。這個視角是百分比視角打肝，子控件的寬高隨著父容器的寬高按照比例變動。最大的父容器就是設(shè)備的寬高挪捕。
- “我的頭像明明是正方形粗梭，怎么變長了？”级零。這是視角是控件視角断医，其約束條件為 控件的寬等于高。
這讓我想起iOS開發(fā)中妄讯，其界面設(shè)計系統(tǒng)AutoLayout孩锡，就采用了一個計算公式：
A = B*ratio+constant
A——某控件的寬、高亥贸、四周邊距等
B——{另一個控件 或者 設(shè)備本身} 的寬、高浇垦、四周邊距等
也就是說炕置，任何控件都可以以其他控件的屬性值來定義自身的屬性值，所以其可塑性非常高男韧。不過實際應(yīng)用中也會帶來一個問題朴摊，就是太靈活，導(dǎo)致多重約束此虑，有時候會彼此沖突甚纲。
仔細(xì)想想，最常見的視角參數(shù)應(yīng)該就只有3個：
- 設(shè)備的寬高朦前。
- 父容器的寬高介杆。
- 自身的寬高比例。
透過這3個參數(shù)韭寸，應(yīng)該可以定義任意控件的屬性值春哨。
現(xiàn)在問題來了，Android怎么做到呢恩伺？答案是：****android-percent-support-extend****
android-percent-support-extend使用流程
- 添加引用
compile 'com.zhy:percent-support-extends:1.1.1'
- 用指定控件代替原有布局空間
- com.zhy.android.percent.support.PercentLinearLayout
- com.zhy.android.percent.support.PercentRelativeLayout
- com.zhy.android.percent.support.PercentFrameLayout
- 使用新的屬性值來指定約束
- layout_heightPercent
- layout_widthPercent
- layout_marginBottomPercent
- layout_marginEndPercent
- layout_marginLeftPercent
- layout_marginPercent
- layout_marginRightPercent
- layout_marginStartPercent
- layout_marginTopPercent
- layout_textSizePercent
- layout_maxWidthPercent
- layout_maxHeightPercent
- layout_minWidthPercent
- layout_minHeightPercent
- layout_paddingPercent
- layout_paddingTopPercent
- layout_paddingBottomPercent
- layout_paddingLeftPercent
- layout_paddingRightPercent
對于值可以雀氨场：10%w , 10%h , 10% , 10%sw , 10%sh，縮寫含義為
- w：父容器寬度
- h：父容器高度
- sw：設(shè)備寬度
- sh：設(shè)備高度
android-percent-support-extend效果
對于一開始的界面晶渠，最后xml文件為：
<?xml version="1.0" encoding="utf-8"?>
<com.zhy.android.percent.support.PercentFrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="#ff7ecc16"
android:gravity="center"
android:text="100%w*match_parent"
app:layout_widthPercent="100%w" />
<TextView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_gravity="bottom|right"
android:layout_margin="30dp"
android:background="#ffff0000"
android:gravity="center"
android:text="28%w*28%w"
app:layout_widthPercent="28%w"
app:layout_heightPercent="28%w"/>
</com.zhy.android.percent.support.PercentFrameLayout>
效果如下：
反思
這種直接裸寫百分比的方式比價繁瑣凰荚，相較之下，目前采用px映射表的方案中寫的px值直接在UI設(shè)計圖中取就行褒脯，更加簡單便瑟。
其實px映射表方案也就是百分比的方案，而且x值和y值已經(jīng)分開憨颠，所以也可以解決正方形變形的問題胳徽。
目前需要客服的問題主要在于px映射為px积锅，導(dǎo)致如果沒有覆蓋到設(shè)備的分辨率，就會出現(xiàn)問題养盗，改成px映射為dp后缚陷，這種問題應(yīng)該會減少很多。
拓展閱讀
Panda
2016-11-29
