Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局

1.概述

1.1 布局的作用:布局是对界面结构的全面规划和安排,通过api中提供的各种布局能够快速的完成对界面的设计和规划
1.2 布局的种类:线性布局(LinearLayout)、相对布局(RelativeLayout)、帧布局(FrameLayout)、表格布局(TableLayout)、网格布局(GridLayout)、约束布局(ConstraintLayout)其中三种不常用布局帧布局、表格布局、网格布局
1.3 常用属性:layout_width 宽度、layout_height 高度、layout_padding 内边距、layout_margin 外边距,这个四个属性是所有布局共有的属性,取值有三种:match_parent匹配父容器、wrap_content适应内容、xxdp具体数值,比如200dp

2.线性布局

1.方向属性orientation:内容摆放的方向,有垂直(vertical)、水平(horizontal)两种

   
            android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_margin="20dp"
        android:padding="20dp">
     
                    android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#ff0000"
            android:text="登录按钮"/>
                    android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#00ff00"
            android:text="退出按钮"/>
                    android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="#0000ff"
            android:text="注册按钮"/>
   

 

2.权重属性layout_weight

如果要出现下图的布局

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第1张图片

这里只需要给第一个控件添加权重

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第2张图片

渲染的时候先展示没有权重的,最后剩余的空间会被有权重的全部拥有

如果要合理的按比例分配,此时要设置layout_width="0dp"(如果垂直设置高度为0dp)

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第3张图片

总共5份,以此占1/5 2/5 2/5,并且控件的内容是不会影响这个比列的

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第4张图片

3.重力属性

让控件左,右,上,下,居中等进行偏移,但是如果水平上的布局比例已经确定,重力属性在水平不再起作用,

如下让中间的偏移到垂直居中

 
Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第5张图片

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第6张图片

2.相对布局

相对布局是通过相对定位的方式让控件出现在布局任意位置; 

在相对布局中如果不指定控件摆放的位置,那么控件都会被默认放在RelativeLayout的左上角。因此要先指定第一个控件的位置,再根据此控件去给其他控件布局。

RelativeLayout常见属性
相对于父容器layout_centerInParent(取值:true/false)

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第7张图片

效果如下

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第8张图片

其他常用属性如下:

    android:layout_centerHrizontal  水平居中
    android:layout_centerVertical 垂直居中
    android:layout_centerInparent    相对于父元素完全居中
    android:layout_alignParentBottom 位于父元素的下边缘
    android:layout_alignParentLeft   位于父元素的左边缘
    android:layout_alignParentRight  位于父元素的右边缘
    android:layout_alignParentTop    位于父元素的上边缘
    android:layout_alignWithParentIfMissing  如果对应的兄弟元素找不到的话就以父元素做参照物


相对于其他控件(取值:其他控件id)

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第9张图片

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第10张图片

其他属性:

android:layout_below      位于元素的下方
    android:layout_above      位于元素的的上方
    android:layout_toLeftOf   位于元素的左边
    android:layout_toRightOf  位于元素的右边

    android:layout_alignTop   该元素的上边缘和某元素的的上边缘对齐
    android:layout_alignLeft  该元素的左边缘和某元素的的左边缘对齐
    android:layout_alignBottom 该元素的下边缘和某元素的的下边缘对齐
    android:layout_alignRight  该元素的右边缘和某元素的的右边缘对齐

3.帧布局

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第11张图片

如上图类似这种布局就是帧布局,后面的子元素直接覆盖在前面的子元素之上,将前面的子元素部分和全部遮挡

常用属性

android:layout_gravity="center"//控件重力
android:gravity="center"//控件内容相对于控件本身的位置
android:foreground="@mipmap/bg"//前景
android:foregroundGravity="center_vetical"//前景重力

案例代码

    android:layout_width="350dp"
    android:layout_height="350dp"
    android:background="#ff0000"
    android:layout_gravity="center"/>
    android:layout_width="200dp"
    android:layout_height="200dp"
    android:background="#00ff00"
    android:layout_gravity="center"
   />
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:background="#0000ff"
    android:layout_gravity="center"
    android:text="测试内容"
    android:textColor="#ffffff"
    android:gravity="center"
    />

效果

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第12张图片

4.表格布局

通过行列的形式展示我们的控件,这样的布局就是表格布局

Android布局——线性布局、相对布局、帧布局、表格布局、网格布局、约束布局_第13张图片

常见属性

android:stretchColumns="*"//设置可伸展的列,传入的是整型数据,即列的索引,*代表所有,也可多个比如1,2
android:shrinkColumns="1"//可伸缩的列
android:collapseColumns="2,3"//隐藏的列

案例代码

    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:stretchColumns="*"
    >
   
   
   

       

你可能感兴趣的:(Android入门到精通)