Android的布局Layout

1. FrameLayout

默认情况下从屏幕左上角(0.0)位置开始排列控件，后面的控件会覆盖或者完全覆盖前面的控件。一般用在启动界面，初始化界面、动画   FragmentTabHost

 

<?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">     <ProgressBar         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_gravity="center"         style="?android:attr/progressBarStyleLarge"/>     <TextView         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_gravity="center"         android:textSize="30sp"         android:text="80%"/> </FrameLayout>

 

2.LinearLayout

LinearLayout是最简单也是最常用的一种布局方式，它根据android:orientation 属性值，将包含的所有控件或布局对象排列在同一个方向：水平或垂直,在这种布局中，所有的控件都是依序排列成一条线。在线性布局中的控件允许有自己的margins和gravity属性。 

LinearLayout.LayoutParams用来定义针LinearLayout布局的专用属性，它包括以下内容： 

 

1)android:layout_weight用于在LinearLayout中把所有子View排布之后的剩余空间按照它们的layout_weight分配给各个拥有这个属性的View。

 

2)位置  android:layout_gravity用于设置组件自身在父组件中的对齐方式。

android:layout_gravity用于设置组件自身在父组件中的对齐方式。需要注意的是，此属性与android: gravity用于设置控件内容的位置。android:gravity用于设置View组件的对齐方式。 

android:gravity="center"来让EditText中的文字在EditText组件中居中显示； 

 

3）边距 android:padding：组件内容相对组件的边缘的距离。因此，它仍属于组件的区域范围。如果为组件设置背景，背景将会覆盖此区域。 

android:margin：组件边缘相对其他组件边缘的距离，即组件之间的距离。 

 

登录示例

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:paddingTop="120dp"     android:orientation="vertical">       <TextView         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_gravity="center_horizontal"         android:textSize="40sp"         android:text="登录"/>     <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:orientation="horizontal">         <TextView             android:layout_width="wrap_content"             android:layout_height="wrap_content"             android:textSize="20sp"             android:text="账号:"/>         <EditText             android:layout_width="0dp"             android:layout_height="wrap_content"             android:layout_weight="1"/>     </LinearLayout>     <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:orientation="horizontal">         <TextView             android:layout_width="wrap_content"             android:layout_height="wrap_content"             android:textSize="20sp"             android:text="密 码:"/>         <EditText             android:layout_width="0dp"             android:layout_height="wrap_content"             android:layout_weight="1"/>     </LinearLayout>     <LinearLayout         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_marginTop="20dp"         android:orientation="horizontal">         <Button             android:layout_width="0dp"             android:layout_height="wrap_content"             android:layout_weight="1"             android:text="确定"/>         <Button             android:layout_width="0dp"             android:layout_height="wrap_content"             android:layout_weight="1"             android:text="取消"/>     </LinearLayout> </LinearLayout>

 

 

3.RelativeLayout

RelativeLayout的子控件会根据它们所设置的参照控件和参数进行相对布局。参照控件可以是父控件，也可以是其它子控件。

 

<?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="wrap_content"     android:padding="50dip">     <TextView         android:id="@+id/label"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:text="Type here:"/>     <EditText         android:id="@+id/entry"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_below="@id/label"/>     <Button         android:id="@+id/ok"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_below="@id/entry"         android:layout_alignParentRight="true"         android:layout_marginLeft="50dip"         android:text="ok" />     <Button         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_toLeftOf="@id/ok"         android:layout_alignTop="@id/ok"         android:text="cancel" /> </RelativeLayout>

 

 

针对父控件的布局属性，如下所示。

android:layout_alignParentTop=“true|false”：为true,将该控件的顶部与其父控件的顶部对齐; 

android:layout_alignParentBottom ：为true,将该控件的底部与其父控件的底部对齐; 

android:layout_alignParentLeft：为true,将该控件的左部与其父控件的左部对齐; 

android:layout_alignParentRight：为true,将该控件的右部与其父控件的右部对齐; 

android:layout_centerHorizontal： 为true,将该控件的置于水平居中; 

android:layout_centerVertical： 为true,将该控件的置于垂直居中; 

android:layout_centerInParent： 为true,将该控件的置于父控件的中央; 

 

针对其它控件的属性，如下所示。

android:layout_above： 将该控件的底部置于指定ID的控件之上;

android:layout_below =“@id/lable”：将该控件的底部置于指定ID的控件之下;

android:layout_toLeftOf：将该控件的右边缘与指定ID的控件左边缘对齐;

android:layout_toRightOf： 将该控件的左边缘与指定ID的控件右边缘对齐;

android:layout_alignBaseline： 将该控件的baseline与指定ID的baseline对齐;

android:layout_alignTop： 将该控件的顶部边缘与指定ID的顶部边缘对齐;

android:layout_alignBottom： 将该控件的底部边缘与指定ID的底部边缘对齐;

android:layout_alignLeft： 将该控件的左边缘与指定ID的左边缘对齐;

android:layout_alignRight：将该控件的右边缘与指定ID的右边缘对齐;

注意，不能在RelativeLayout容器本身和它的子元素之间产生循环依赖，比如说，不能将RelativeLayout的高设置成为WRAP_CONTENT的时候将子元素的高设置成为ALIGN_PARENT_BOTTOM。

 

取值为数值：

android:layout_marginLeft="50dip"
android:padding=”20dp”

 

RelativeLayout登录界面

LinearLayout登录界面

登录界面

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent"     android:layout_height="match_parent">     <TextView         android:id="@+id/loginTv"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:textSize="40sp"         android:layout_marginTop="120dp"         android:layout_centerHorizontal="true"         android:text="登录"/>     <TextView         android:id="@+id/accountTv"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:textSize="20sp"         android:layout_below="@id/loginTv"         android:layout_alignParentLeft="true"         android:text="账号:"/>     <EditText         android:id="@+id/accountEt"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_toRightOf="@id/accountTv"         android:layout_alignTop="@id/accountTv"         android:layout_alignBottom="@id/accountTv"/>     <TextView         android:id="@+id/passwordTv"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_below="@id/accountTv"         android:layout_alignParentLeft="true"         android:text="密 码:"         android:textSize="20sp" />     <EditText         android:id="@+id/passwordEt"         android:layout_width="match_parent"         android:layout_height="wrap_content"         android:layout_toRightOf="@id/passwordTv"         android:layout_alignTop="@id/passwordTv"         android:layout_alignBottom="@id/passwordTv"/>     <Button         android:id="@+id/confirmBtn"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_centerHorizontal="true"         android:layout_below="@id/passwordTv"         android:layout_alignParentLeft="true"         android:text="确定" />     <Button         android:id="@+id/cancelBtn"         android:layout_width="wrap_content"         android:layout_height="wrap_content"         android:layout_toRightOf="@id/confirmBtn"         android:layout_alignTop="@id/confirmBtn"         android:text="取消" /> </RelativeLayout>

 

 

4.TableLayout

TableLayout把它的子视图定位到行和列中.表布局容器不显示行,列和单元的边界线.表的列和最多行单元数一样多.一个表可以有空单元,但是单元不能像HTML里面那样跨列.

TableRow 对象是一个TableLayout的子视图(每个TableRow定义了表中的一个单独行).每行有0或多个单元,可用任何其他视图定义.因此,行单元可能由各个视图对象组成,如ImageView或TextView对象.一个单元也可以是一个ViewGroup对象(比如,你可以嵌入另一个表布局作为一个单元).

下面的示例布局有两行,各有两个单元,单元边界被显示为虚线(为了增加视觉效果)

 

<?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent"     android:layout_height="match_parent"     android:stretchColumns="1">     <TableRow>         <TextView             android:text="@string/table_layout_4_open"             android:padding="3dip" />         <TextView             android:text="@string/table_layout_4_open_shortcut"             android:gravity="right"             android:padding="3dip" />     </TableRow> <View android:layout_height="2dip" android:background="#FF909090"/>     <TableRow>         <TextView             android:text="@string/table_layout_4_save"             android:padding="3dip" />         <TextView             android:text="@string/table_layout_4_save_shortcut"             android:gravity="right"             android:padding="3dip" />     </TableRow> </TableLayout>

 

列可以被隐藏,带有延伸标记并填充可用屏幕空间,或者可以被标记为可收缩来强制这个列缩小直到表适合屏幕.

 

android:stretchColumns (尽量把指定的列填充空白部分)    TableLayout android:shrinkColumns(收缩指定的列以适应屏幕)          TableLayout android:collapseColumns(隐藏指定的列)                  TableLayout android:layout_column(控件放在指定的列)                View android:layout_span(该控件所跨越的列数,合并单元格)     View

 

5.GridLayout

 

计算器界面

 

 

<?xml version="1.0" encoding="utf-8"?> <GridLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="wrap_content"     android:layout_height="wrap_content"     android:layout_gravity="center"     android:orientation="horizontal"     android:rowCount="5"     android:columnCount="4" > 　　<Button android:id="@+id/one" android:text="1"/> 　　<Button android:id="@+id/two" android:text="2"/> 　　　<Button android:id="@+id/three" android:text="3"/> 　　<Button android:id="@+id/devide" android:text="/"/> 　　<Button android:id="@+id/four" android:text="4"/> 　　<Button android:id="@+id/five" android:text="5"/> 　　<Button android:id="@+id/six" android:text="6"/> 　　<Button android:id="@+id/multiply" android:text="×"/> 　　<Button android:id="@+id/seven" android:text="7"/> 　　<Button android:id="@+id/eight" android:text="8"/> 　　<Button android:id="@+id/nine" android:text="9"/> <Button android:id="@+id/minus" android:text="-"/> <Button android:id="@+id/zero" android:layout_columnSpan="2" android:layout_gravity="fill" android:text="0"/> 　　<Button android:id="@+id/point" android:text="."/> <Button android:id="@+id/plus" android:layout_rowSpan="2" android:layout_gravity="fill" android:text="+"/> <Button android:id="@+id/equal" android:layout_columnSpan="3" android:layout_gravity="fill" android:text="="/> </GridLayout>