Android UI常用的布局容器

一、概述

布局本身是不能显示出任何数据, 它可以包含一些子视图, 并控制子视图的布局 。

常用的Layout

– LinearLayout 

– RelativeLayout 

– FrameLayout 

– ListView(后面讲)

– GridView(后面讲)

– 其它

二、LinearLayout 

线性布局: 用来控制其子View以水平或垂直方式展开显示 

重要属性: 

orientation(方向)

layout_weight(权重) 

 

三、理解LinearLayout权重

1、layout_weight(权重)的值 

=0(默认值): 指定多大空间就占据多大的空间 。

>0:  将父视图中的可用空间进行分割, 值越大权重就越大, 占据的比例就会越大 。

2、Layout_weight的使用场景 

将布局的宽度或高度平均分成几个等份 。

垂直方向上占用中间所有空间 或 水平方向上占用中间所有空间。

 

四、RelativeLayout 

相对布局: 用来控制其子View以相对定位的方式进行布局显示 。

相对布局是最灵活, 最强大,也是学习难度最大的布局 。

相对布局相关属性比较多:

兄弟视图之间: 同方向对齐, 反方向对齐 。

与父视图之间: 同方向对齐, 居中。

 

五、、FrameLayout 

帧布局中的每一个子View都代表一个画面，默认以屏幕左上角作为（ 0,0 ）坐标，按定义的先后顺序依次逐屏显示 ， 后面出现的会覆盖前面的画面, 。

通过子View的android:layout_gravity 属性来指定子视图的位置。

类似前端的CSS的div层。

 

六、GridLayout(网格布局)

所有子控件默认在GridLayout中横向依次排列，当只等每行的列数时，到达指定列数

常用属性:
排列对齐:
①设置组件的排列方式:   android:orientation=""     vertical(竖直,默认)或者horizontal(水平)
②设置组件的对齐方式:   android:layout_gravity=""   center,left,right,buttom

设置布局为几行几列:
①设置有多少行: android:rowCount="4"        //设置网格布局有4行
②设置有多少列: android:columnCount="4"    //设置网格布局有4列

设置某个组件位于几行几列
注:都是从0开始算的哦！
①组件在第几行: android:layout_row = "1"   //设置组件位于第二行 
②组件在第几列: android:layout_column = "2"   //设置该组件位于第三列

设置某个组件横跨几行几列:
①横跨几行: android:layout_rowSpan = "2"     //纵向横跨2行
②横跨几列: android:layout_columnSpan = "3"     //横向横跨2列

 

七、TableLayout(表格布局)

表格布局和网格布局类似，但是需要注意的是，表格布局不能跨行，只能跨列

TableLayout常用属性：
android:shrinkColumns：设置可收缩的列，内容过多就收缩显示到第二行
android:stretchColumns：设置可伸展的列，将空白区域填充满整个列
android:collapseColumns：设置要隐藏的列
列的索引从0开始，shrinkColumns和stretchColumns可以同时设置。
子控件常用属性：
android:layout_column：第几列
android:layout_span：占据列数

 

八、常用基本属性

1、通用布局属性

注意的是属性还可以这样使用android:gravity="bottom|center"表示底部中心

 

1、内边距与外边距

属性就是图上的词，例如：android:layout:paddingLdft;

2、相对兄弟视图定位

同方向对齐属性

layout_alignRight 与指定控件右对齐

layout_alignLeft 与指定控件左对齐

layout_alignTop 与指定控件上对齐

反方向对齐属性

layout_toRightOf 在指定控件的右边

layout_toLeftOf 在指定控件的左边

layout_above 在指定控件的上边

layout_below 在指定控件的下边子控件对齐关系

3、相对父视图定位

相对父视图居中属性

layout_centerInParent 与父容器中间对齐 pairunte

layout_centerVertical 与父容器竖向中心对齐

layout_centerHorizontal 与父容器横向中心对齐

与父视图同方向对齐属性

layout_alignParentLeft 与父容器左边对齐

layout_alignParentTop 与父容器上边对齐

layout_alignParentRight 与父容器右边对齐

layout_alignParentBottom 与父容器下边对齐