Android UI– 排布视图

Android UI– 排布视图

FrameLayout

最简单的布局容器，这个容器完全不安排子视图，它只是简单到呈现每一个视图，从上到下摆下来。视图的顺序是基于它们在XML文件中的声明。视图在文件的后部声明的会被画在顶部，任何时候你想创建重叠视图时都可以使用这个视图。

TableLayout

该视图展示表格格式的数据，它把子视图放置成行和列，每一行都包含在一个TableRow容器中。一个TableLayout将会有和最多单元的TableRow一样多的列。与大多数视图的子视图不同，TableLayout的子视图不能制定一个layout_width，这个是由TableLayout处理并为你设置。

LinearLayout

顾名思义，这个容器把它的子视图按照垂直或者水平方向单向排列。Orientation属性为linearLayout子视图设置方向。子视图会指定它们将会占用线性布局多大空间，通过设置layout_weight做到这一点。这个参数确定了对比其他子视图的相对权值。
一般来说layout_weight会覆盖layout_height以及layout_width属性，但也不总是如此。如果你打算使用layout_weight属性，把对应的height或者width设置为0dp，这样一来，视图的大小就会只由权值控制，而不受到别的干扰了。

RelativeLayout

这是另外一个常见的布局容器，相对布局比线性布局更加灵活，但是它们同样更加复杂。顾名思义，文本图基于子视图相对于其他视图的位置以及该文本视图本身来摆放子视图。举个例子，要在一个按钮(my_button)的左侧放置一个文本视图，你将会创建一个属性toLeftOf=”@id/my_button”的文本视图。这种灵活性让你可以在此容器中创建非常复杂的UI。

RelativeLayout的XML属性

属性	描述
layout_alignParentTop,layout_alignParentBottom, layout_alignParentRight,layout_alignParentLeft	这些属性将会把视图与其父视图对齐。使用这些可以把视图固定在RelativeLayout的边角。这些值可以是true或false
layout_centerHorizontal,layout_centerVertical, layout_centerInParent	使用这些属性来放置视图位于水平中心或者竖直中心，或者直接放在父RelativeLayout的中央。值可以是true或false
layout_alignTop,layout_alignBottom,layout_alignRight, layout_alignLeft	这些属性用来与另一个视图对齐。使用这些来以队列形式排布布局中的视图。值必须是另一个视图id
layout_alignBaseline	这个属性设置视图的所有边缘都与指定的视图对齐。在你有重叠的视图并且需要它们恰好完全匹配时这个很有用。它的值必须为另一个视图的id
layout_above,layout_below,layout_leftOf,layout_rightOf	使用这些属性来相对于另一个视图放置视图。这个属性设置视图的规则，以确保它不会越过目标视图的边界，它的值必须为另一个视图的id

在相对布局中不能有循环依赖。例如，你不能把RelativeLayout的width设为wrap_content并且在子视图上使用alignParentTop。这将会产生错误，不会生产R.java文件。

GridLayout

顾名思义，它把视图安排成一个由行和列组成的网络。这个布局使得创建常见的“仪表盘”风格的UI变得更加容易。一般来说你会使用TableLayout创建这样的UI，但是GridLayout允许你创建一个低层次相同布局。这会减少Android要画视图的数目，从而提高性能。GridLayout同样也支持使用图形布局编辑器进行拖放来设计UI。

示例：

<?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="3">
<Button
      android:id="@+id/button1"
      android:layout_column="1"
      android:layout_row="1"
      android:text="Button" />
<Button
      android:id="@+id/button2"
      android:layout_column="1"
      android:layout_gravity="bottom"
      android:layout_row="2"
      android:text="Button" />
<Button
      android:id="@+id/button3"
      android:layout_column="2"
      android:layout_row="2"
      android:text="Button" />
<Button
      android:id="@+id/button4"
      android:layout_column="2"
      android:layout_row="3"
      android:text="Button" />