Android Support库百分比布局

之前写过一篇屏幕适配的文章Android 屏幕适配最佳实践,里面提到了类似百分比布局的东西,但是该方法缺点很明显,就会增加很多无用的数据,导致apk包变大。

而谷歌的support库中,增加了一个叫做percent库,该库在如图目录下,如果没有,请使用sdk manager更新至最新

在使用前,我们先看下这个库有哪些类

很明显里面有一个FrameLayout布局的子类和RelativeLayout布局的子类,此外还有一个Helper类,这个Helper类主要是完成百分比的测量工作,里面有一个接口PercentLayoutParams,如果我们自己要实现百分比布局,那么就要实现这个接口。

我们看下谷歌对外公布了什么自定义属性

==========></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

使用前加入库文件依赖

compile ‘com.android.support:percent:22.2.0’

开始编写布局文件,我们要实现的效果如图所示

即左边红色部分宽度占屏幕30%,高度占屏幕90%,右边宽度占屏幕70%,高度各占屏幕45%。在不使用百分比布局之前,我们一般是使用LinearLayout的weight达到这种效果,然而使用weight会增加布局的嵌套,会过度绘制。那么使用百分比布局会变成什么样的,无需布局嵌套,设置高度宽度百分比即可。

<androidxmlns: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”><Viewandroid: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%”/><Viewandroid: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%”/><Viewandroid: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>

我们要设置左边的布局宽度占30%,使用app:layout_widthPercent=”30%”,高度占90%,为了演示另一个属性的使用,这里不直接设置高度为90%,而是设置高度为100%,底边距为10%,即

layout_marginBottomPercent=”10%”

同理编写右边两个的布局。

正如文章开头看到的,这个库只提供了两个百分比布局给我们使用,比较常见的线性布局并没有提供对应的百分比布局。因此,我们想能不能自己实现一个呢,答案是肯定的,通过观察现有的两个百分比布局的代码,我们需呀继承原来的布局,即LinearLayout,编写对应的构造方法调用父类。声明一个PercentLayoutHelper对象辅助完成百分比测量,此外还需要重写onMeasure和onLayout方法,以及一个 实现了PercentLayoutHelper.PercentLayoutParams接口的继承原来布局的LayoutParams的LayoutParams。

那么我们新建一个叫PercentLinearLayout的继承LinearLayout的类,实现其构造方法,以及声明一个final的PercentLayoutHelper 对象。

{private final PercentLayoutHelper mHelper = new PercentLayoutHelper(this);public PercentLinearLayout(Context context) {super(context);}public PercentLinearLayout(Context context, AttributeSet attrs) {super(context, attrs);}public PercentLinearLayout(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}}不甚酒力,体会不了酒的美味,但却能感受知已的妙处。

Android Support库百分比布局

相关文章:

你感兴趣的文章:

标签云: