Android百分比布局支持库介绍——com.android.support:percent

库下载地址 ： https://github.com/JulienGenoud/android-percent-support-lib-sample

在此之前，相信大家都已经对 Android API 所提供的布局方式非常熟悉了。也许在接触 Android 的时候都有过这样的想法，如果可以按照百分比的方式进行界面布局，这样适配各种屏幕就简单多了吧！！以前的一个小梦想，现在终于得以实现，谷歌正式提供百分比布局支持库（ percent-support-lib ）。

获取支持库：

使用 Android studio 在 build.gradle 添加以下信息就可以获取支持库，当然了，如果你没有下载到该支持库会提示你下载。

[AppleScript]  纯文本查看  复制代码

?

1 2 3 4 5

dependencies {        compile 'com.android.support : percent : 22.2 . 0 '   }

新的布局组件：

在这个包里面有两个新的容器类

1 、 PercentRelativeLayout

2 、 PercentFrameLayout

在此看来，这两个类很显然是继承自  FrameLayout  和  RelativeLayout  两个容器类。

新的属性设置：

新的容器有了一些设置百分比的属性，下面我们来了解一下：

• layout_widthPercent
  

设置控件宽度为父容器的宽的百分比

• layout_heightPercent
  

设置控件高度为父容器的高的百分比

• layout_marginPercent
  

• layout_marginLeftPercent
  

设置控件与左边控件的距离为父容器的宽度的百分比

• layout_marginTopPercent
  

设置控件与上方控件的距离为父容器的高度的百分比

• layout_marginRightPercent
  

设置控件与右边控件的距离为父容器的宽度的百分比

• layout_marginBottomPercent
  

设置控件与下方控件的距离为父容器的高度的百分比

• layout_marginStartPercent
  

与上面的说明类似

• layout_marginEndPercent
  

与上面的说明类似

从命名的方式我们可以知道，原来用某些具体单位（如 dp ）的设置现在都可以用百分比的方式进行设置了，例如设置控件的宽度 layout_width 原来我们是这样玩的 android:layout_width="match_parent" 现在用了百分比的属性之后呢，可以这样玩了 app:layout_widthPercent="50%" ，这里的百分比是相对于父容器而言的。

使用介绍：

官方文档地址： https://juliengenoud.github.io/android-percent-support-lib-sample/

在布局的 xml 文件需要添加下面这行来声明

[XML]  纯文本查看  复制代码

?

1	xmlns:app="http://schemas.android.com/apk/res-auto"

官方示例代码：

[XML]  纯文本查看  复制代码

?

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21

< 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" />         < ImageView             app:layout_widthPercent = "50%"             app:layout_heightPercent = "50%"             app:layout_marginTopPercent = "25%"             app:layout_marginLeftPercent = "25%" />     </ android.support.percent.PercentFrameLayout />

上面是官方文档的使用示例代码，但是实际上使用的时候如果没设置控件的宽高是会报错的。

实验的布局代码：

[XML]  纯文本查看  复制代码

?

01 02 03 04 05 06 07 08 09 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 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99

< 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/top_left"            android:layout_width = "0dp"            android:layout_height = "0dp"            android:layout_alignParentTop = "true"            android:background = "#ff0000"            app:layout_heightPercent = "30%"            app:layout_widthPercent = "70%" />             < View            android:id = "@+id/top_right"            android:layout_width = "0dp"            android:layout_height = "0dp"            android:layout_alignParentTop = "true"            android:layout_toRightOf = "@+id/top_left"            android:background = "#00ff00"            app:layout_heightPercent = "30%"            app:layout_widthPercent = "30%" />                  < View            android:id = "@+id/centre"            android:layout_width = "match_parent"            android:layout_height = "0dp"            android:layout_below = "@+id/top_left"            android:background = "#0000ff"            app:layout_marginLeftPercent = "10%"            app:layout_marginRightPercent = "20%"            app:layout_marginTopPercent = "10%"            app:layout_marginBottomPercent = "10%"            app:layout_heightPercent = "40%" />             < View            android:layout_width = "match_parent"            android:layout_height = "0dp"            android:id = "@+id/bottom"            android:layout_below = "@+id/centre"            android:background = "#00f0ff"            android:layout_alignParentLeft = "true"            android:layout_alignParentStart = "true"            app:layout_heightPercent = "10%" />             </ android.support.percent.PercentRelativeLayout >

布局图1

下面我对百分比布局的属性进行了一些小实验，来验证我的几个问题：

1、layout_marginTopPercent这种类型的参数具体的意义是什么？

答：中间的蓝色 view 设置了我们疑惑的属性

[XML]  纯文本查看  复制代码

?

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21

< View            android:id = "@+id/centre"            android:layout_width = "match_parent"            android:layout_height = "0dp"            android:layout_below = "@+id/top_left"            android:background = "#0000ff"            app:layout_marginLeftPercent = "10%"            app:layout_marginRightPercent = "20%"            app:layout_marginTopPercent = "10%"            app:layout_marginBottomPercent = "10%"            app:layout_heightPercent = "40%" />

然后我们在看看实现的效果，请看布局图 1 。

再将 layout_marginLeftPercent 这类型的属性跟以前我们熟悉的 layout_marginLeft 类型属性对比可知， layout_marginLeftPercent 属性是控件距离左边控件的距离为父类容器的宽度的百分比，其余属性类似。（其实这里不能证明是相对于父容器还是相对于屏幕而言，我们在下面进行证明）

2、控件设置的百分比是相对于屏幕还是相对于父容器而言呢？

答：从上面的实验代码我们基本了解了各种属性的使用，但是不禁疑惑百分比这个是相对父容器而言的吗？也许自然我们就会想到应该是相对于父容器，但是不在实践中证明始终都是不放心的。实践是证明真理的唯一标准！！

好的，其实要证明也很容易。下面我们对容器类的宽度和高度分别进行修改，然后看看显示的情况。

1 ）修改高度为定值 300dp

[XML]  纯文本查看  复制代码

?

1 2 3 4 5 6 7 8 9

< 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 = "300dp" >

然后我们看看显示的情况

2 ）修改宽度为 200dp

[XML]  纯文本查看  复制代码

?

1 2 3 4 5 6 7 8 9

< 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 = "200dp"   android:layout_height = "match_parent" >

再看看效果

实验结论：

从实验结果可知，百分比布局设置的属性都是相对于父容器而言的。

最后：

谷歌提供的新的布局方式给我们，百分比布局的方式。但是可惜的是以支持库的形式，也就是说需要给我们的项目增加一些体积咯。百分比布局的方式对于屏幕适配有了不少的进步，至少我是这么认为的。希望以后的 安卓系统直接支持百分比布局吧。

转自：http://www.apkbus.com/android-244752-1-1.html?_dsign=0b699c42