【android基础篇之二】结合DroidDraw工具谈Android的几种常用布局（layout）

Android常用的布局有：

• 线性布局（LinearLayout）：线性布局简单实用，通过Orientation属性来控制整个屏幕的布局。Orientation有水平（horizontal）和垂直（vertical）两种取值。
• 相对布局（RelativeLayout）：相对布局较为复杂，通过控件（View）之间的相对位置来控制整个屏幕的布局。要充分掌握相对布局需要着重理解“相对”的概念。“相对”是个模糊的概念，属于解释性的，在使用相对布局时，我们得尽量让其“绝对”化。
• 表格布局（TableLayout）：表格布局很好理解，通过行和列来控制整个屏幕的布局。TableLayout的详细描述见：Android学习-UI-TableLayout。在此感谢http://blog.csdn.net/huanmenghen的博主。

其他的还有帧布局（FrameLayout）和绝对布局（AbsoluteLayout），这个不常用。

1、线性布局（LinearLayout）

线性布局通过DroidDraw来设计非常简单，在位于屏幕中间的位置找到Root Layout复选框中选择LinearLayout，如下图：

下面就可以向里边添加我们需要的控件了。添加控件之前，我们先设置LinearLayout的Orientation属性值，以便控制控件的布局。

屏幕右侧的Tab窗口中选择Properties页可找到LinearLayout的Orientation属性设置。设置完成需提交（Apply）。下面是我设置的界面：

上图左边是DroidDraw中的界面，右边是直接拷贝代码到Eclipse中设计器生成的界面，没什么不同。下面把linear_layout.xml文件代码附上：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
	android:id="@+id/widget57"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:orientation="vertical"
	xmlns:android="http://schemas.android.com/apk/res/android">
<LinearLayout
	android:id="@+id/widget63"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content">
<TextView
	android:id="@+id/widget65"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="TextView" />
<EditText
	android:id="@+id/widget64"
	android:layout_width="171dp"
	android:layout_height="wrap_content"
	android:text="EditText"
	android:textSize="18sp" />
</LinearLayout>
<LinearLayout
	android:id="@+id/widget66"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content">
<TextView
	android:id="@+id/widget68"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="TextView" />
<EditText
	android:id="@+id/widget67"
	android:layout_width="172dp"
	android:layout_height="wrap_content"
	android:text="EditText"
	android:textSize="18sp" />
</LinearLayout>
<LinearLayout
	android:id="@+id/widget69"
	android:layout_width="fill_parent"
	android:layout_height="wrap_content">
<Button
	android:id="@+id/widget70"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_marginLeft="15dp"
	android:text="Button"
	android:layout_weight="1"
	android:layout_gravity="center_horizontal" />
<Button
	android:id="@+id/widget71"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:layout_marginRight="15dp"
	android:text="Button"
	android:layout_weight="1"
	android:layout_gravity="center_horizontal" />
</LinearLayout>
</LinearLayout>

2、相对布局（RelativeLayout）

不多说，请看下边两张图：

同样左边是DroidDraw的，右边是Eclipse的，看出来有明显的不同。这倒不是说DroidDraw不行，而是我们没有很好的控制控件之间的“相对”位置。下面把relative_layout.xml文件代码附上：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
	android:id="@+id/widget72"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
	android:id="@+id/widget81"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="TextView"
	android:layout_alignParentTop="true"
	android:layout_alignParentLeft="true" />
<EditText
	android:id="@+id/widget82"
	android:layout_width="159dp"
	android:layout_height="wrap_content"
	android:text="EditText1"
	android:textSize="18sp"
	android:layout_below="@+id/widget81"
	android:layout_toRightOf="@+id/widget81" />
<EditText
	android:id="@+id/widget87"
	android:layout_width="155dp"
	android:layout_height="wrap_content"
	android:text="EditText2"
	android:textSize="18sp"
	android:layout_below="@+id/widget82"
	android:layout_alignParentLeft="true" />
<Button
	android:id="@+id/widget88"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Button1"
	android:layout_alignBaseline="@+id/widget87"
	android:layout_alignParentRight="true" />
<Button
	android:id="@+id/widget89"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Button2"
	android:layout_below="@+id/widget88"
	android:layout_toLeftOf="@+id/widget88" />
<Button
	android:id="@+id/widget90"
	android:layout_width="wrap_content"
	android:layout_height="wrap_content"
	android:text="Button3"
	android:layout_alignTop="@+id/widget89"
	android:layout_alignParentRight="true" />
</RelativeLayout>

    我们分析一下上面的xml文件，android:layout_alignParentTop="true"和android:layout_alignParentLeft="true"设置使得TextView“绝对”在那里。EditText1则位于TextView的右下方，有ndroid:layout_below="@+id/widget81"和android:layout_toRightOf="@+id/widget81"限定。EditText2和Button1分别在布局的左边和右边，EditText2在EditText1的下边，而Button1与EditText2基线对齐，这两个控件位置也“绝对”了。

    接下来Button2被限定在Button1的左下方，Button3这与Button2顶端对齐并与靠布局的右边。看上去一点问题都没有啊，我这样修改了一下：

第一种方法：增加对Button1的限定，添加android:layout_below="@+id/widget82"，限定Button1在EditText1的下方。可以解决问题。

第二种方法：把android:layout_below="@+id/widget88"修改为android:layout_below="@+id/widget87"即把Button2限定在EditText2的下方，而不是在Button1的下方。

    从上面可以得出这样的结论：android:layout_align*等等属性是不能确定控件的“绝对”位置的，在RelativeLayout布局里，要尽量使用android:layout_below，android:layout_above等属性使控件的相对位置“绝对”化。