为了更好的管理Android应用的用户界面的的各种组件,Android提供了布局管理器。通使用布局管理器,Android应用的图形用户界面具有良好的平台无关性。通过局管理器来管理自检的分布、大小,而不是直接设置组件的位置和大小。常用的布局管理器有线性布局、表格布局、帧布局、相对布局,绝对布局等。
1、线性布局
线性布局由LinearLayout类来代表,它们将容器里的组件一个挨着一个地排列起来。不仅可以控制各组件横向排列,也可控制各组件纵向排列。
LinearLayout的常用XML属性及相关方法的说明
XML属性 |
相关方法 |
说明 |
android:gravity |
setGravity(int) |
设置布局管理器内组件的对齐方式。该属性支持top,bottom,left,right,center_certical, center_horizontal,fill_horizontal,center, fill,clip_vertical,clip_horizontal。也可以同时制定多种堆砌方式的组合,例如left|center_horizontal 代表出现在屏幕左边,而且垂直居中。竖线前后千万不能出现空格 |
android:orientation |
setOrientation(int) |
设置布局管理器内组件的排列方式,可以设置为 horizontal(水平排列)、vertical(垂直排列、默认值)两个值的其中之一 |
LinearLayout布局示例:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="bottom|center_horizontal" > <Button android:id="@+id/bn1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/bn1" /> <Button android:id="@+id/bn2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/bn2" /> </LinearLayout>
结果如图:
注:上面定义了一个简单的线性布局管理器,并定义了两个按钮。代码第三行指定水平排列所有组件。第六行指定多有组件对齐到容器底部并且水平居中。
2.表格布局
表格布局由TableLayout所代表,表格布局采用行,列的形式来管理UI组件,TableLayout并不需要明确地声明包含多少行,列,而是通过添加TableRow,其他组件来控制表格的行数和列数。
每次想TableLayout中添加一个TableRow,该TableRow就是一个表格行,TableRow也是容器,因此它可以不断地添加其他组件,每添加一个子组件该表格就增加一列。
TableLayout的常用XML属性及相关方法的说明
XML属性 |
相关方法 |
说明 |
android:collapseColumns |
setColumnCollapsed(int,boolean) |
设置需要被隐藏的列的列序号,多个列序号之间用逗号隔开 |
android:shrinkColumns |
setShrinkAkllColumns(boolean) |
设置允许被收缩的列的列序号,多个列序号之间用逗号隔开 |
android:stretchColumns |
setStretchAllColumns(boolean) |
设置允许被拉伸的列的列序号,多个列序号之间用逗号隔开 |
TableLayout应用示例:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <!-- 定义第一个表格布局,指定第2列允许收缩,第3列允许拉伸 --> <TableLayout android:id="@+id/TableLayout01" android:layout_width="fill_parent" android:layout_height="wrap_content" android:shrinkColumns="1" android:stretchColumns="2" > <!-- 直接添加按钮,它自己会占一行 --> <Button android:id="@+id/ok1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="独自一行的按钮" /> <!-- 添加一个表格行 --> <TableRow> <!-- 为该表格行添加3个按钮 --> <Button android:id="@+id/ok2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮" /> <Button android:id="@+id/ok3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="允许被收缩的按钮" /> <Button android:id="@+id/ok4" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="允许被拉伸的按钮" /> </TableRow> </TableLayout> <!-- 定义第二个表格布局 ,指定第二列隐藏--> <TableLayout android:id="@+id/TableLayout01" android:layout_width="fill_parent" android:layout_height="wrap_content" android:collapseColumns="1" > <!-- 直接添加按钮,它自己会占一行 --> <Button android:id="@+id/ok5" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text=" 独自一行的按钮 " /> <!--定义一个表格行--> <TableRow> <!-- 为该表格行添加3个按钮 --> <Button android:id="@+id/ok6" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮1" /> <Button android:id="@+id/ok7" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="被隐藏的按钮" /> <Button android:id="@+id/ok8" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮 3" /> </TableRow> </TableLayout> <!-- 定义第三个表格布局 ,指定第2、3两列可以被拉伸--> <TableLayout android:id="@+id/TableLayout01" android:layout_width="fill_parent" android:layout_height="wrap_content" android:stretchColumns="1,2" > <!-- 直接添加按钮,它自己会占一行 --> <Button android:id="@+id/ok9" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="独自一行的按钮" /> <!--定义一个表格行--> <TableRow> <!-- 为该表格行添加3个按钮 --> <Button android:id="@+id/ok10" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮" /> <Button android:id="@+id/ok11" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="允许被拉伸的按钮" /> <Button android:id="@+id/ok12" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="允许被拉伸的按钮" /> </TableRow> <!--定义一个表格行--> <TableRow> <!-- 为该表格行添加2个按钮 --> <Button android:id="@+id/ok13" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="普通按钮" /> <Button android:id="@+id/ok14" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="允许被拉伸的按钮" /> </TableRow> </TableLayout> </LinearLayout>
运行结果:
3.帧布局
帧布局由FrameLayout所代表,帧布局容器为每个加入其中的组件创建一个空白的区域(成为一帧),所有每个子组件占据一帧,这些帧都会根据gravity属性执行自动对齐。也就是说,把组件一个一个的叠加在一起。
FrameLayout的常用XML属性及相关方法的说明
XML属性 |
相关方法 |
说明 |
android:foreground |
setForeground(Drawable) |
设置该帧布局容器的前景图像 |
android:foregroundGravity |
FrameLayout应用示例:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <!-- 依次定义3个TextView,先定义的TextView位于底层 后定义的TextView位于上层 --> <TextView android:id="@+id/View01" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="210px" android:height="50px" android:background="#ff0000" /> <TextView android:id="@+id/View02" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="180px" android:height="50px" android:background="#dd0000" /> <TextView android:id="@+id/View03" android:layout_width="wrap_content" android:layout_height="wrap_content" android:width="150px" android:height="50px" android:background="#bb0000" /> </FrameLayout>
4.相对布局
相对布局由RelativeLayout代表,相对布局容器内子组件的位置总是相对兄弟组件、父容器来决定的,因此这种布局方式被称为相对布局。
如果A组件的位置是由B组件的位置来决定的,Android要求先定义B组件,再顶定义A组件。
RelativeLayout的XML属性及相关方法说明
XML属性 |
相关方法 |
说明 |
android:gravity |
setGravity(int) |
设置该布局容器内部各子组件的对齐方式 |
|
setIgnoreGravity(int) |
设置哪个组件不受gravity组件的影响 |
RelativeLayout.LayoutParams里只能设为boolean值得属性
属性 |
说明 |
android:layout_centerHorizontal |
控制该子组件是否位于布局容器的水平居中位置 |
android:layout_centerVertical |
控制该子组件是否位于布局容器的垂直居中位置 |
android:layout_Inparent |
控制该子组件是否位于布局容器的中央位置 |
android:layout_alignParentBottom |
控制该子组件是否位于布局容器低端对齐 |
android:layout_alignParentLeft |
控制该子组件是否位于布局容器左边对齐 |
android:layout_alignParentRight |
控制该子组件是否位于布局容器右边对齐 |
android:layout_alignParentTop |
控制该子组件是否位于布局容器顶端对齐 |
RelativeLayout.LayoutParams里只能设为其他UI组件ID的属性
XML属性 |
说明 |
android:layout_toRightOf |
控制该子组件位于给出ID组件的右侧 |
android:layout_toLeftOf |
控制该子组件位于给出ID组件的左侧 |
android:layout_above |
控制该子组件位于给出ID组件的上方 |
android:layout_below |
控制该子组件位于给出ID组件的下方 |
android:layout_alignTop |
控制该子组件位于给出ID组件的上边界对齐 |
android:layout_alignBottom |
控制该子组件位于给出ID组件的下边界对齐 |
android:layout_alignLeft |
控制该子组件位于给出ID组件的左边界对齐 |
android:layout_alignRight |
控制该子组件位于给出ID组件的右边界对齐 |
RelativeLayoutTest应用示例:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <!-- 定义该组件位于父容器中间 --> <TextView android:id="@+id/view01" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/leaf" android:layout_centerInParent="true" /> <!-- 定义该组件位于view01组件的上方 --> <TextView android:id="@+id/view02" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/leaf" android:layout_above="@id/view01" android:layout_alignLeft="@id/view01" /> <!-- 定义该组件位于view01组件的下方 --> <TextView android:id="@+id/view03" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/leaf" android:layout_below="@id/view01" android:layout_alignLeft="@id/view01" /> <!-- 定义该组件位于view01组件的左边 --> <TextView android:id="@+id/view04" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/leaf" android:layout_toLeftOf="@id/view01" android:layout_alignTop="@id/view01" /> <!-- 定义该组件位于view01组件的右边 --> <TextView android:id="@+id/view05" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/leaf" android:layout_toRightOf="@id/view01" android:layout_alignTop="@id/view01" /> </RelativeLayout>
运行结果:
.5、绝对布局
绝对布局由AbsoluteLayout代表,Android不提供如何布局控制,而是由开发人员自己通过X坐标,Y坐标来控制组件的位置。
XML属性说明
XML属性 |
说明 |
android:layout_x |
指定该子组件的X坐标 |
android:layout_y |
指定该子组件的Y坐标 |
Android中一般支持以下常用的距离单位
px(像素):每个px对应屏幕上的一个点。
dip或dp(device independent pixels,设备独立像素):一种及与屏幕密度的抽象单位。 在每英寸160点的显示器上,1dip=1px,但随着屏幕密度的改变,dip与px的换算会发生改变。
sp(scaled pixels,比例像素):主要处理字体的大小,可以根据用户的字体大小首选项进行缩放
in(英寸):标准长度单位
mm(毫米):标准长度单位
pt(磅):标准长度单位,1/72英寸
AbsoluteLayout应用示例:
<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <!-- 定义一个文本框,使用绝对定位 --> <TextView android:layout_x="20dip" android:layout_y="20dip" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="用户名:" /> <!-- 定义一个文本编辑框,使用绝对定位 --> <EditText android:layout_x="80dip" android:layout_y="15dip" android:layout_width="wrap_content" android:width="200px" android:layout_height="wrap_content" /> <!-- 定义一个文本框,使用绝对定位 --> <TextView android:layout_x="20dip" android:layout_y="80dip" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="密 码:" /> <!-- 定义一个文本编辑框,使用绝对定位 --> <EditText android:layout_x="80dip" android:layout_y="75dip" android:layout_width="wrap_content" android:width="200px" android:layout_height="wrap_content" android:password="true" /> <!-- 定义一个按钮,使用绝对定位 --> <Button android:layout_x="130dip" android:layout_y="135dip" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="登 录" /> </AbsoluteLayout>
运行结果: