Android学习——布局
Android一共有6种布局:LinearLayout线性布局、RelativeLayout相对布局、FrameLayout帧布局、TableLayout表格布局、GridLayout网格布局、ConstraintLayout约束布局
一、LinearLayout线性布局
线性布局。这个布局简单的说,就是所有控件都依次排序,
谁也不会覆盖谁。线性布局需要定义一个方向,
在最开始我通常会使用orientation属性来定义布局中控件的排列方式,Horizontal空间水平排列,Vertical控件垂直排列。
这是一个线性布局的垂直排列
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <TextView android:layout_width="100dp" android:layout_height="100dp" android:background="@color/purple_500" android:text="hello world"/> <TextView android:layout_width="100dp" android:layout_height="100dp" android:background="@color/teal_200" android:text="hello world"/> <TextView android:layout_width="100dp" android:layout_height="100dp" android:background="@color/teal_700" android:text="hello world"/> <TextView android:layout_width="100dp" android:layout_height="100dp" android:background="#00ff00" android:text="hello world"/> </LinearLayout>
将orientation改为horizontal布局将会变为下面这样
我使用的Android Studio默认为空间水平排列
线性布局中还有两个常用属性分别为divider分割线和layout_weight权重(等比例划分区域)
<TextView android:layout_width="100dp" android:layout_height="100dp" android:background="@color/purple_500" android:layout_weight="1" android:text="hello world"/>
<!--分割线--> <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <size android:height="1dp" android:width="30sp" /> <solid android:color="@color/black" /> </shape>
二、RelativeLayout相对布局
在线性布局中控件只能水平或垂直排列,不够灵活,相对布局能够解决其相对应的不足,它能够根据容器和控件的相对定位来操作控件。
1、根据父容器定位
在根据父容器定位时,属性一般有Parent,例如:layout_alignParentLeft 左对齐
2、根据兄弟组件定位
在这个定位中,每个控件都有id,根据id进行相对的定位。
下面是相对布局的基本使用
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/first" android:layout_width="100dp" android:layout_height="100dp" android:text="hello world" android:background="@color/teal_700" /> <TextView android:id="@+id/second" android:layout_width="100dp" android:layout_height="100dp" android:text="hello world" android:background="@color/teal_200" android:layout_toRightOf="@id/first"/> <TextView android:id="@+id/third" android:layout_width="100dp" android:layout_height="100dp" android:text="hello world" android:background="@color/purple_500" android:layout_below="@id/first"/> <TextView android:id="@+id/fourth" android:layout_width="100dp" android:layout_height="100dp" android:text="hello world" android:background="@color/purple_200" android:layout_centerInParent="true"/> <TextView android:id="@+id/sixth" android:layout_width="100dp" android:layout_height="100dp" android:text="hello world" android:background="@color/black" android:layout_centerVertical="true"/> </RelativeLayout>
除此之外,还有一个通用属性margin,可以用来设置组件与父容器的边距
三、FrameLayout帧布局
这个布局的所有控件都会默认放在左上角
它的两个重要属性为foreground设置前景和foregroundGravity设置前景的位置
<TextView android:layout_width="100dp" android:layout_height="100dp" android:text="hello world" android:background="@color/black" android:foreground="@color/purple_500"/>
如这个,这个控件本身背景色为黑色,但设置前景之后,第一眼看到的便不是黑色
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_gravity="center" android:background="#687564" android:id="@+id/textView" android:layout_width="300dp" android:layout_height="300dp" android:text="第一个" /> <TextView android:layout_gravity="center" android:background="#422322" android:id="@+id/textView2" android:layout_width="200dp" android:layout_height="200dp" android:text="第二个" /> <TextView android:layout_gravity="center" android:background="#f1f1f1" android:id="@+id/textView3" android:layout_width="100dp" android:layout_height="100dp" android:text="第三个" /> <TextView android:layout_gravity="center" android:background="#f22" android:id="@+id/textView4" android:layout_width="80dp" android:layout_height="80dp" android:text="第四个" /> </FrameLayout>
四、TableLayout表格布局
Tablelayout类以行和列的形式对控件进行管理,每一行为一个TableRow对象,或一个View控件。当为TableRow对象时,可在TableRow下添加子控件,默认情况下,每个子控件占据一列。
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <TableLayout android:id="@+id/table1" android:layout_width="fill_parent" android:layout_height="wrap_content" android:collapseColumns="1" android:stretchColumns="0" android:shrinkColumns="3"> <!-- 隐藏了第二列--> <!-- 拉伸了第一列--> <!-- 收缩了第四列--> <TableRow> <Button android:text="one"></Button> <Button android:text="two"></Button> <Button android:text="three"></Button> <Button android:text="four"></Button> <Button android:text="five"></Button> </TableRow> </TableLayout> <TableLayout android:id="@+id/table2" android:layout_width="wrap_content" android:layout_height="wrap_content"> <TableRow> <Button android:text="one" android:layout_column="2" ></Button> <Button android:text="two" android:layout_span="2" ></Button> </TableRow> </TableLayout> </LinearLayout>
五、GridLayout网格布局
作为android 4.0 后新增的一个布局,与前面介绍过的TableLayout(表格布局)其实有点大同小异;
不过新增了一些东东
①跟LinearLayout(线性布局)一样,他可以设置容器中组件的对齐方式
②容器中的组件可以跨多行也可以跨多列(相比TableLayout直接放组件,占一行相比较)
<?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:columnCount="5" android:rowCount="5"> <!--设置显示行和列的个数--> <Button android:text="on"/> <Button android:text="two" android:layout_column="3"/> <Button android:text="three"/> <Button android:text="four" android:layout_column="3"/> </GridLayout>
子控件的属性:
layout_column | 显示在第几列 | layout_row | 显示在第几行 |
layout_columnSpan | 横向跨列 | layout_rowSpan | 纵向跨行 |
layout_columnWeight | 横向剩余空间分配 | layout_rowWeigth | 纵向剩余空间分配 |
layout_gravity | 在网格中显示位置 |
六、ConstraintLayout约束布局
我认为约束布局是这六个布局中最简单的一个,它也是Android Studio的默认布局
直接使用控件将你想要的布局创建出来即可,相当于画一个图(不用写代码),自由度非常大。