Android百分比布局库

前言：

 Android在6.0（api23）引入了百分比布局库，这个库以support包的形式供我们使用。以前的那几种布局中要实现等比分割布局只有LinearLayout的layout_weight属性可以轻松实现，现在不同了，有了这个百分比布局库我们可以更加方便灵活地百分比分割我们的布局，从而使得我们的界面编写更加方便。Android百分比布局库中提供了PercentFrameLayout和PercentRelativeLayout两种布局。

由于百分比库不是内置在Android SDK的，所以要使用这个库，首先需要引入这个库：

compile 'com.android.support:percent:24.2.1'

引入成功后sync，接着我们开始使用这个百分比布局库。

1、PercentFrameLayout

PercentFrameLayout继承了FrameLayout，所以对于FrameLayout的属性它也都支持，同时它提供了以下新的属性：

• layout_widthPercent：宽度百分比，如50%表示占据基值的50%，50%p表示占据父布局宽度的50%

• layout_heightPercent：高度百分比，如50%表示占据基值的50%，50%p表示占据父布局高度的50%

• layout_marginPercent：边缘所占百分比

• layout_marginLeftPercent：左边缘所占百分比

• layout_marginTopPercent：上边缘所占百分比

• layout_marginRightPercent：右边缘所占百分比

• layout_marginBottomPercent：下边缘所占百分比

• layout_marginStartPercent：17版本以下等同于marginLeftPercent

• layout_marginEndPercent：17版本以下等同于marginRightPercent

• layout_aspectRatio：纵横比，意思是宽度或高度你随意设置一个，剩下的一个将根据这个纵横比得到，你可以设置其中一个的百分比宽度或高度也可以设置为普通的layout_width或layout_height。

基本用法，如：

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.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">
    <Button
        app:layout_widthPercent="50%"
        android:text="button1"
        android:layout_gravity="left|top"
        app:layout_heightPercent="50%"/>

    <Button
        app:layout_widthPercent="50%"
        android:text="button2"
        android:layout_gravity="left|bottom"
        app:layout_heightPercent="50%"/>

    <Button
        app:layout_widthPercent="50%"
        android:text="button3"
        android:layout_gravity="right|top"
        app:layout_heightPercent="50%"/>

    <Button
        app:layout_widthPercent="50%"
        android:text="button4"
        android:layout_gravity="right|bottom"
        app:layout_heightPercent="50%"/>

</android.support.percent.PercentFrameLayout>

效果：

由于不是内置sdk的布局，需要xmlns:app=”http://schemas.android.com/apk/res-auto”命名空间。

2、PercentRelativeLayout

 同样第，PercentRelativeLayout继承自RelativeLayout，新增的属性有：

• layout_widthPercent

• layout_heightPercent

• layout_marginPercent

• layout_marginLeftPercent

• layout_marginTopPercent

• layout_marginRightPercent

• layout_marginBottomPercent

• layout_marginStartPercent

• layout_marginEndPercent

• layout_aspectRatio

与PercentFrameLayout一样，这里通过PercentFrameLayout实现上述同样的效果：

<?xml version="1.0" encoding="utf-8"?>
<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">
    <Button
        app:layout_widthPercent="50%p"
        android:text="button1"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        app:layout_heightPercent="50%p"/>

    <Button
        app:layout_widthPercent="50%p"
        android:text="button2"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true"
        app:layout_heightPercent="50%p"/>

    <Button
        app:layout_widthPercent="50%p"
        android:text="button3"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        app:layout_heightPercent="50%p"/>

    <Button
        app:layout_widthPercent="50%p"
        android:text="button4"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        app:layout_heightPercent="50%p"/>

</android.support.percent.PercentRelativeLayout>

可以看到效果和PercentFrameLayout实现的一样。