之前写过一篇屏幕适配的文章Android 屏幕适配最佳实践,里面提到了类似百分比布局的东西,但是该方法缺点很明显,就会增加很多无用的数据,导致apk包变大。
而谷歌的support库中,增加了一个叫做percent库,该库在如图目录下,如果没有,请使用sdk manager更新至最新
在使用前,我们先看下这个库有哪些类
很明显里面有一个FrameLayout布局的子类和RelativeLayout布局的子类,此外还有一个Helper类,这个Helper类主要是完成百分比的测量工作,里面有一个接口PercentLayoutParams,如果我们自己要实现百分比布局,那么就要实现这个接口。
我们看下谷歌对外公布了什么自定义属性
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="PercentLayout_Layout"> <attr name="layout_widthPercent" format="fraction"/> <attr name="layout_heightPercent" format="fraction"/> <attr name="layout_marginPercent" format="fraction"/> <attr name="layout_marginLeftPercent" format="fraction"/> <attr name="layout_marginTopPercent" format="fraction"/> <attr name="layout_marginRightPercent" format="fraction"/> <attr name="layout_marginBottomPercent" format="fraction"/> <attr name="layout_marginStartPercent" format="fraction"/> <attr name="layout_marginEndPercent" format="fraction"/> </declare-styleable> </resources> |
看到这些属性应该能直接明白这些属性的意思,其属性值类型为fraction,即小数,百分比。主要属性有宽度,高度占是百分比,外边距的百分比,其中Android MarginLeft与MarginStart的区别参考Android MarginLeft与MarginStart的区别,提取关键内容如下。
在写layout布局的时候,我们会发现有这样几个比较相似的属性:
MarginStart MarginLeft
MarginEnd MarginRight这些属性的区别是什么? 根据api注释,我们得知MarginStart指的是控件距离开头View部分的间距大小,MarginLeft则指的是控件距离左边View部分的间距大小,MarginEnd和MarginRight同理。
一般情况下,View开始部分就是左边,但是有的语言目前为止还是按照从右往左的顺序来书写的,例如阿拉伯语,在Android 4.2系统之后,Google在Android中引入了RTL布局,更好了支持了由右到左文字布局的显示,为了更好的兼容RTL布局,google推荐使用MarginStart和MarginEnd来替代MarginLeft和MarginRight,这样应用可以在正常的屏幕和由右到左显示文字的屏幕上都保持一致的用户体验。
了解了这些后,我们开始使用PercentRelativeLayout
使用前加入库文件依赖
1 |
compile 'com.android.support:percent:22.2.0' |
开始编写布局文件,我们要实现的效果如图所示
即左边红色部分宽度占屏幕30%,高度占屏幕90%,右边宽度占屏幕70%,高度各占屏幕45%。在不使用百分比布局之前,我们一般是使用LinearLayout的weight达到这种效果,然而使用weight会增加布局的嵌套,会过度绘制。那么使用百分比布局会变成什么样的,无需布局嵌套,设置高度宽度百分比即可。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
<android.support.percent.PercentRelativeLayout 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" > <View android:id="@+id/left" android:layout_width="0dp" android:layout_height="0dp" android:layout_alignParentBottom="true" android:background="#ff0000" app:layout_heightPercent="100%" app:layout_marginBottomPercent="10%" app:layout_widthPercent="30%"/> <View android:id="@+id/right_top" android:layout_width="0dp" android:layout_height="0dp" android:layout_alignParentRight="true" android:background="#00ff00" app:layout_heightPercent="45%" app:layout_widthPercent="70%"/> <View android:id="@+id/right_bttom" android:layout_width="0dp" android:layout_height="0dp" android:layout_alignParentRight="true" android:layout_alignParentBottom="true" android:background="#ffff00" app:layout_heightPercent="45%" app:layout_marginBottomPercent="10%" app:layout_widthPercent="70%"/> </android.support.percent.PercentRelativeLayout> |
我们要设置左边的布局宽度占30%,使用app:layout_widthPercent=”30%”,高度占90%,为了演示另一个属性的使用,这里不直接设置高度为90%,而是设置高度为100%,底边距为10%,即