android 布局总结


转自http://www.apkbus.com/android-45156-1-1.html

本帖最后由 北小生 于 2012-5-11 02:10 编辑



01.jpg (27.68 KB, 下载次数: 39)

下载附件  保存到相册

2012-5-10 23:50 上传

     Android 布局是应用界面开发的重要一环，在Android中，共有五种布局方式，分别是：LinearLayout(线性布局),FrameLayout(单帧布局),AbsoluteLayout(绝对布局),RelativeLayout(相对布局)，TableLayout(表格布局)。

    下面先分别介绍一下每种布局的基本概念,再用实例演示：

LinearLayout：线性布局，可分为垂直布局（android:orientation="vertical"）和水平布局（android:orientation="horizontal" ），在LinearLayout里面可以放多个控件，但是一行（列）只能放一个控件。
FrameLayout：单帧布局，所有控件都放置在屏幕左上角（0,0），可以放多个控件，但是会按控件定义的先后顺序依次覆盖，后一个会直接覆盖在前一个之上显示，如果后放的比之前的大，会把之前的全部盖住（类似于一层层的纸张）。
AbsoluteLayout：绝对布局，可以直接指定子控件的绝对位置（例如： android:layout_x="60px" android:layout_y="32px" ），这种布局简单直接，但是由于手机的分辨率大小不统一，绝对布局的适应性比较差。
RelativeLayout：相对布局，其子控件是根据所设置的参照控件来进行布局的，设置的参照控件可以是父控件，也可以使其他的子控件。
TableLayout：表格布局，是以行列的形式来管理子控件的，在表格布局中的每一行可以是一个View控件或者是一个TableRow控件。而TableRow控件中还可以添加子控件。

[align=center]=============================下面是实例==========================[/align]

LinearLayout：线性布局

[align=left]LinearLayout实例的框架图，这个例子使用了布局套布局来实现如下图所示的框架效果。[/align]



2.jpg (61.12 KB, 下载次数: 43)

下载附件  保存到相册

2012-5-11 01:00 上传

[align=left]    其中有三个LinearLayout 布局，最外层的 LinearLayout 中包含两个 LinearLayout 将界面分为上下两个部分，上面的 LinearLayout 中使用垂直布局将三个TextView纵向排列，下面的 LinearLayout 中使用水平布局将三个TextView横行排列。[/align]
[align=left]    其中注意的是 android：layout_weight，用于给一个线性布局中的诸多视图的重要度赋值，所有的view的layout_weight缺省值都是为0，意味着他们只在屏幕上占据它们需要显示的空间大小。activity根据这个View的比0大的layout_weight值来划分剩余的空间和其它Views定义的layout_weight也按比例进行空间的划分。[/align]



4.png (22.61 KB, 下载次数: 32)

下载附件  保存到相册

2012-5-11 01:57 上传

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical"

    >

    <LinearLayout

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:orientation="vertical"

        android:layout_weight="1"

        >

        <TextView

            android:text="第一行"

            android:gravity="center"

            android:textSize="24px"

            android:background="#0066ff"

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:layout_weight="1"

            />

         <TextView

            android:text="第二行"

            android:gravity="center"

            android:textSize="24px"

            android:background="#ffcc00"

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:layout_weight="1"

            />

          <TextView

            android:text="第三行"

            android:gravity="center"

            android:textSize="24px"

            android:background="#33cc00"

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:layout_weight="1"

            />

    </LinearLayout>

    <LinearLayout

        android:layout_width="fill_parent"

        android:layout_height="wrap_content"

        android:orientation="horizontal"

        android:layout_weight="1"

        >

          <TextView

            android:text="第一列"

            android:gravity="center"

            android:textSize="24px"

            android:background="#33cc00"

            android:layout_width="wrap_content"

            android:layout_heigh
4000
t="fill_parent"

            android:layout_weight="1"

            />

         <TextView

            android:text="第二列"

            android:gravity="center"

            android:textSize="24px"

            android:background="#ffcc00"

            android:layout_width="wrap_content"

            android:layout_height="fill_parent"

            android:layout_weight="1"

            />

          <TextView

            android:text="第三列"

            android:gravity="center"

            android:textSize="24px"

            android:background="#0066ff"

            android:layout_width="wrap_content"

            android:layout_height="fill_parent"

            android:layout_weight="1"

            />   

    </LinearLayout>

</LinearLayout>

复制代码
[align=left]FrameLayout：单帧布局[/align]

在FrameLayout 中放了 三个 ImageView 分别引用图片  c b a ，图片一层层覆盖到界面上。



5.png (14.05 KB, 下载次数: 38)

下载附件  保存到相册

2012-5-11 02:03 上传

<?xml version="1.0" encoding="utf-8"?>

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent" >

    <ImageView

        android:src="@drawable/c"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        />

    <ImageView

        android:src="@drawable/b"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        />

    <ImageView

        android:src="@drawable/a"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        />

</FrameLayout>