Android百分比布局初探

简介: 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010046908/article/details/48802909


标题:Android百分比布局初探

依赖库:——com.android.support:percent

实现原理:

在这个包里面有两个新的容器类
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/
官网代码:
1.
PercentFrameLayout
 
    
<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/>


2. PercentRelativeLayout
<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>


效果:



相关文章
|
XML Android开发 数据安全/隐私保护
10. 【Android教程】网格布局 GridLayout
10. 【Android教程】网格布局 GridLayout
581 1
|
2月前
|
存储 消息中间件 人工智能
【05】AI辅助编程完整的安卓二次商业实战-消息页面媒体对象(Media Object)布局实战调整-按钮样式调整实践-优雅草伊凡
【05】AI辅助编程完整的安卓二次商业实战-消息页面媒体对象(Media Object)布局实战调整-按钮样式调整实践-优雅草伊凡
109 11
【05】AI辅助编程完整的安卓二次商业实战-消息页面媒体对象(Media Object)布局实战调整-按钮样式调整实践-优雅草伊凡
|
2月前
|
XML 存储 Java
【06】AI辅助编程完整的安卓二次商业实战-背景布局变更增加背景-二开发现页面跳转逻辑-替换剩余图标-优雅草卓伊凡
【06】AI辅助编程完整的安卓二次商业实战-背景布局变更增加背景-二开发现页面跳转逻辑-替换剩余图标-优雅草卓伊凡
104 3
【06】AI辅助编程完整的安卓二次商业实战-背景布局变更增加背景-二开发现页面跳转逻辑-替换剩余图标-优雅草卓伊凡
|
移动开发 监控 前端开发
构建高效Android应用:从优化布局到提升性能
【7月更文挑战第60天】在移动开发领域,一个流畅且响应迅速的应用程序是用户留存的关键。针对Android平台,开发者面临的挑战包括多样化的设备兼容性和性能优化。本文将深入探讨如何通过改进布局设计、内存管理和多线程处理来构建高效的Android应用。我们将剖析布局优化的细节,并讨论最新的Android性能提升策略,以帮助开发者创建更快速、更流畅的用户体验。
191 10
|
ARouter Android开发
Android不同module布局文件重名被覆盖
Android不同module布局文件重名被覆盖
|
Android开发
08. 【Android教程】相对布局 RelativeLayout
08. 【Android教程】相对布局 RelativeLayout
391 0
|
编解码 Android开发
【Android Studio】使用UI工具绘制,ConstraintLayout 限制性布局,快速上手
本文介绍了Android Studio中使用ConstraintLayout布局的方法,通过创建布局文件、设置控件约束等步骤,快速上手UI设计,并提供了一个TV Launcher界面布局的绘制示例。
376 1
|
ARouter Android开发
Android不同module布局文件重名被覆盖
Android不同module布局文件重名被覆盖
803 0
|
Android开发 Kotlin
kotlin开发安卓app,如何让布局自适应系统传统导航和全面屏导航
使用`navigationBarsPadding()`修饰符实现界面自适应,自动处理底部导航栏的内边距,再加上`.padding(bottom = 10.dp)`设定内容与屏幕底部的距离,以完成全面的布局适配。示例代码采用Kotlin。
377 15
|
XML Android开发 数据安全/隐私保护
使用RelativeLayout布局Android界面
使用RelativeLayout布局Android界面
下一篇
oss云网关配置