Android 百分比布局支持库com.android.support:percent使用


  • Android 百分比布局支持库comandroidsupportpercent使用
  • 概述
  • 效果展示
  • 使用方法


概述

Android适配一直是个头疼的问题,最近的一个项目中要适配所有的手机和平板,使用android:layout_weight权重固然是个解决方法,但是个人觉得没有百分比扩展性和适用性强,翻出以前的代码看看用了一大堆代码如今用百分百就那几行就解决了。结合网上的一些资料整理来共享给大家,节省大家开发过程中在屏幕适配上面的时间

效果展示

[android-percent-support-lib-sample]GITHub上面的例子以及展示如下

好不好先看下效果在说

android 百分比计算_屏幕适配

android 百分比计算_控件_02

使用方法

1. 在Android studio 工程下的module 项目的       build.gradle加入如下内容`dependencies {
    compile 'com.android.support:percent:22.2.0'
}`
 2. 两种布局供大家使用: 
PercentRelativeLayout、PercentFrameLayout共大家使用
从名字也可以看出来他们是继承了RelativeLayout和FrameLayout两个容器类;
 3. 支持的属性有:
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%",这里的百分比是**相对于父容器**而言的。
  1. 代码示例
<android.support.percent.PercentRelativeLayout
    xmlns:android="http:///apk/res/android"
    xmlns:app="http:///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="#ff44aacc"
        app:layout_heightPercent="20%"
        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="#ffe40000"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="30%" />


    <View
        android:id="@+id/bottom"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_below="@+id/top_left"
        android:background="#ff00ff22"
        app:layout_heightPercent="80%" />
</android.support.percent.PercentRelativeLayout>

android 百分比计算_android 百分比计算_03

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentFrameLayout
    xmlns:android="http:///apk/res/android"
    xmlns:app="http:///apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_gravity="left|top"
        android:background="#44ff0000"
        android:text="width:30%,height:20%"
        app:layout_heightPercent="20%"
        android:gravity="center"
        app:layout_widthPercent="30%"/>

    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_gravity="right|top"
        android:gravity="center"
        android:background="#4400ff00"
        android:text="width:70%,height:20%"
        app:layout_heightPercent="20%"
        app:layout_widthPercent="70%"/>


    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_gravity="bottom"
        android:background="#770000ff"
        android:text="width:100%,height:10%"
        android:gravity="center"
        app:layout_heightPercent="10%"
        app:layout_widthPercent="100%"/>


</android.support.percent.PercentFrameLayout>

android 百分比计算_屏幕适配_04