Android布局总结

Android布局分别是LinearLayout （ 线性布局）、 TableLayout （表格布局） 、 RelativeLayout （相对布局）、FrameLayout（ 帧布局 ） 、AbsoluteLayout（绝对布局） 。

1、LinearLayout （线性 布局 ）

“ LinearLayout ”翻译成中文是 “ 线性布局 ” ，所谓线性布局就是在该标签下的所有子元素会根据其 orientation 属性的值来决定是按行或者是按列逐个显示。

示例 main.xml 布局文件如下：

<? xml version = "1.0"encoding = "utf-8" ?> < LinearLayout 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_width ="fill_parent" android:layout_height ="wrap_content" android:text ="@string/name_text" /> < EditText android:layout_width ="fill_parent" android:layout_height ="wrap_content" /> < Button android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:text ="@string/cancle_button" /> < Button android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:text ="@string/ok_button" /> </ LinearLayout > 其对应 strings.xml 内容如下： <? xml version = "1.0"encoding = "utf-8" ?> < resources > < string name = "hello" >Hello World, UIActivity! </ string > < string name = "app_name"> 用户界面 </ string > < string name = "name_text"> 请输入用户名 </ string > < string name = "ok_button"> 确定 </ string > < string name ="cancle_button" > 取消 </ string > </ resources >

效果图如下：

垂直排列元素

其属性“ xmlns:android ”指定命名空间，顶级元素必须指定命名空间。而在该命名空间中的控件的属性 如layout_width ，要在属性前加上“ android ：” 做前缀。其属性 “ layout_width” 指定该元素的宽度，可选值有三种 ， “ fill_parent ” 、“ wrap_content ” 、具体数字（单位为 px ） 。其中 “ fill_parent ” 代表填满其父元素，对于顶级元素来说，其父元素就是整个手机屏幕 。 “ wrap_content ” 代表该元素的大小仅包裹其自身内容，而数字则代表其占相应的 px 。其属性“ layout_height ”指定该元素的高度， 可选参数值与 “ layout_width ” 的参数意义相同。

其属性“ orientation ”指定子元素排列方式， 其中指定为 “ vertical ” 则是子元素垂直排列 ， 每个子元素会占独立的一行 ， 如上图 ， 而另一个可选值为 “ horizontal ” 代表子元素水平排列，即每个子元素会占独立的一列。示例 main.xml 布局文件如下。其对应的strings.xml 内容不变。

main .xml

<? xml version = "1.0"encoding = "utf-8" ?> < LinearLayout xmlns:android = "http://schemas.android.com/apk/res/android" android:orientation ="horizontal" android:layout_width ="fill_parent" android:layout_height ="fill_parent" > < TextView android:layout_width ="wrap_content" android:layout_height ="fill_parent" android:text = "@string/name_text" /> < EditText android:layout_width ="wrap_content" android:layout_height ="wrap_content" /> < Button android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:text ="@string/cancle_button" /> < Button android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:text ="@string/ok_button" /> </ LinearLayout >

效果图如下：

2 、RelativeLayout （相对布局）

相对布局中的视图组件是按相互之间的相对位置来确定的， 并不是线性布局中的必须

按行或按列单个显示。示例布局文件如下：

main.xml

<? xml version = "1.0"encoding = "utf-8" ?> < RelativeLayout xmlns:android ="http://schemas.android.com/apk/res/android" android:layout_width ="fill_parent" android:layout_height ="fill_parent" > < TextView android:layout_width ="fill_parent" android:layout_height ="wrap_content" android:text ="@string/name_text" android:id = "@+id/text" /> < EditText android:layout_width ="fill_parent" android:layout_height ="wrap_content" android:layout_below = "@id/text" android:id = "@+id/edit" /> < Button android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:text ="@string/cancle_button" android:layout_alignParentRight ="true" android:layout_below = "@id/edit" android:id = "@+id/cancle" /> < Button android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:layout_toLeftOf ="@id/cancle" android:layout_alignTop ="@id/cancle" android:text = "@string/ok_button"/> </ RelativeLayout >

说明：

android:layout_below="@id/text" ：将该元素放到 id 为 text 的元素的下面

android:layout_toLeftOf="@id/ok" ：放到 id 为 ok 的元素左边

android:layout_alignTop="@id/ok" ：对齐 id 为 ok 的元素的顶部

界面效果如图：

3、TableLayout （表格布局）

表格布局的风格跟 HTML 中的表格比较接近，只是所采用的标签不同。

<TableLayout > 是顶级元素，说明采用的是表格布局

<TableRow> 定义一个行

<TextView > 定义一个单元格的内容

示例布局文件内容如下：

<? xml version = "1.0"encoding = "utf-8" ?> < TableLayout xmlns:android ="http://schemas.android.com/apk/res/android" android:layout_width ="fill_parent" android:layout_height ="fill_parent" android:stretchColumns ="0,1,2,3" > < TableRow > < TextView android:text = "@string/name" android:gravity = "center" android:padding = "3dip" /> < TextView android:text = "@string/gender" android:gravity = "center" android:padding = "3dip" /> < TextView android:text = "@string/age" android:gravity = "center" android:padding = "3dip" /> < TextView android:text = "@string/phonenum" android:gravity = "center" android:padding = "3dip" /> </ TableRow > < TableRow > < TextView android:text = "@string/name1" android:gravity = "center" android:padding = "3dip" /> < TextView android:text = "@string/gender1" android:gravity = "center" android:padding = "3dip" /> < TextView android:text = "@string/age1" android:gravity = "center" android:padding = "3dip" /> < TextView android:text ="@string/phonenum1" android:gravity = "center" android:padding = "3dip" /> </ TableRow > < TableRow > < TextView android:text = "@string/name2" android:gravity = "center" android:padding = "3dip" /> < TextView android:text = "@string/gender1" android:gravity = "center" android:padding = "3dip" /> < TextView android:text = "@string/age2" android:gravity = "center" android:padding = "3dip" /> < TextView android:text ="@string/phonenum2" android:gravity = "center" android:padding = "3dip" /> </ TableRow > </ TableLayout >

android:stretchColumns="0,1,2,3"

该属性指定每行都由第“ 0 、 1 、 2 、 3 ”列占满空白空间。

gravity 指定文字对齐方式，本例都设为居中对齐。

padding 指定视图与视图内容间的空隙，单位为像素。

对应的 strings.xml 文件内容如下：

<? xml version = "1.0"encoding = "utf-8" ?> < resources > < string name = "name" > 姓名 </string > < string name = "gender" > 性别 </string > < string name = "age" > 年龄 </string > < string name = "phonenum"> 电话 </ string > < string name = "gender1" >男 </ string > < string name = "gender2" >女 </ string > < string name = "name1" > 张三 </string > < string name = "age1" > 25</ string > < string name = "phonenum1"> 1234567 </ string > < string name = "name2" > 李四 </string > < string name = "age2" > 24</ string > < string name = "phonenum2"> 7654321 </ string > </ resources >

界面效果如下：

4、FrameLayout （帧布局）

帧布局中的每一个组件都代表一个画面，默认以屏幕左上角作为（ 0,0 ）坐标，按组件

定义的先后顺序依次逐屏显示， 后面出现的会覆盖前面的画面 。 用该布局可以实现动画效果 。接下来，我们用三幅图片实现一只小鸟飞翔的动画效果。三张图片如下：

编写 main.xml 文件

其内容如下：

<? xml version = "1.0"encoding = "utf-8" ?> < FrameLayout xmlns:android ="http://schemas.android.com/apk/res/android" android:layout_width ="wrap_content" android:layout_height ="wrap_content" android:layout_gravity = "center" android:id = "@+id/frame" > </ FrameLayout >

在该布局文件中定义一个 id 为 frame 的帧布局文件。

编写 BirdActivity.java 类

内容如下：

public class BirdActivity extends Activity{ FrameLayout frame = null ; private boolean flag = true ; // 由该类两个方法间的循环调用，实现界面不断更新。 class MyHandler extends Handler{ int i = 0; public void handleMessage(Message msg) { i ++; // 总共三幅图，依次显示 show( i % 3); show( i % 3); // 再次调用 sleep 方法 sleep(10); } public void sleep( long delayMillis) { // 判断是否继续飞翔 if ( flag ) { // 实质上是调用了一次handleMessage sendMessageDelayed(obtainMessage(0),delayMillis); } } } // 该方法是被调用以更新帧布局的前景图片 void show( int j) { // 获取三张图片 Drawable a =getResources().getDrawable(R.drawable. a ); Drawable b =getResources().getDrawable(R.drawable. b ); Drawable c =getResources().getDrawable(R.drawable. c ); // 不同的情况，设置不同的前景 switch (j) { case 0: frame .setForeground(a); break ; case 1: frame .setForeground(b); break ; case 2: frame .setForeground(c); break ; } } /** Called when the activity is firstcreated. */ @Override public void onCreate(BundlesavedInstanceState) { super .onCreate(savedInstanceState); setContentView(R.layout. main ); frame = (FrameLayout) findViewById(R.id.frame ); // 创建一个 Handler 子类对象，要调用其方法 final MyHandler myHandler = newMyHandler(); myHandler.sleep(10); // 为 fram 设置点击事件，当其被点击时，在飞翔与暂停飞翔间切换。 frame .setOnClickListener( newView.OnClickListener() { @Override public void onClick(View v) { flag = ! flag ; myHandler.sleep(10); } }); } }

说明：

由于 FrameLayout 中后出现的 UI 控件会覆盖前面出现的 UI 控件，每次只能显示一个 UI 控件，因此，我们可以通过在 Activity 中对每次显示的图片内容进行切换以实现动画效果。 或许你会想到开启一条线程来控制切换 ， 但在非主线程中不能更新 UI 界面 ， 所以 ， 我们使用了Android 提供的消息通讯类Handler 。该类可以实现非主线程和负责 UI 的主线程之间的通信，进而间接实现非主线程更新 UI 界面。由于 sleep 方法中的sendMessageDelayed(obtainMessage(0), delayMillis); 本身会延迟发送一个消息 ， 该消息会被框架传递给handleMessage 事件。 我们在handleMessage() 方法中再次调用 sleep() 方法，形成一个循环调用。 在我们对界面进行点击之前 ， 两个方法会一直循环调用 。 前景图片也会不断的切换，进而实现动画的效果。

运行程序，效果你自己试试就知道了！！！！

5、 AbsoluteLayout（绝对布局）

绝色地布局由AbsoluteLayout代表。绝对布局就像java中awt编程中的空布局，就是Android不提供任何布局控制，而是由开发人员自己通过x坐标、y坐标来控制组件的位置。娄使用AbsoluteLayout作为布局容器时，布局容器不再管理子组件的位置、大小——这些都需要开发人啼自己控制；

使用绝对布局时，每个子组件都可指定如下两个xml属性；

Layout_x:指定该子组件上的x坐标；

Layout_y:指定该子组件上的y坐标；

大部分时候，使用绝对布局都不是一个好思路，因为运行Adroid应用的手机往往千差万别，因此屏幕大小、分辨率都存在较大差异，使用绝对布局会很验证兼顾不同屏幕大小、分辨率问题；