android XML layout

yinter

开发过Android应用的同学们都知道，Android工程-res- layout资源文件夹下存放着控制view布局的xml文件，我们可以通过 getViewById(int i)方法，从XML中构造view及其子类，在这个过程当中，XML文件中的一切layout属性也将被赋予这个view。当然，我们也能够通过代码来为某一个view来设置layout，那是后话。通过对集中layout的分析和比较我发现，Android中AbsoluteLayout与CSS的绝对定位很像，TableLayout与HTML的表格定位很像，而RelativeLayout与CSS的相对定位很像。前两者都已经是老生常谈了，我重点比较一下最后一对，即RelativeLayout与CSS的相对定位（Position:relative）。先看一段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"
    android:orientation="vertical">
    <RadioGroup android:id="@+id/radioGroup"
        android:layout_width="fill_parent" android:layout_height="167px"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical">
        <RadioButton android:id="@+id/Queen"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="@string/Queen">
        </RadioButton>
        <RadioButton android:id="@+id/Rook"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="@string/Rook">
        </RadioButton>
        <RadioButton android:id="@+id/Knight"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="@string/Knight">
        </RadioButton>
        <RadioButton android:id="@+id/Bishop"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="@string/Bishop">
        </RadioButton>
    </RadioGroup>
    <Button android:id="@+id/promotion"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" android:layout_below="@id/radioGroup"
        android:text="@string/promote" />
</RelativeLayout>

上面一段XML，这是我为Android国际象棋游戏中的一个“兵行底线”编写的Custom Dialog（自定义对话框）的XML layout。在这里简单定义了几个控件（来自于android.wedget包）的一些位置和外观。可以看到，根节点RelativeLayout告诉我们这是相对定位的布局，然后从上至下由一个RadioGroup（内含四个RadioButton）以及一个Button。通过最下面的 android:layout_below属性，告诉Button要在radioGroup下面呈现。

这是一个非常简单的属性，在relativeLayout下，还有很多属性，见下表
android:layout_above   Positions the bottom edge of this view above the given anchor view ID.
android:layout_alignBaseline   Positions the baseline of this view on the baseline of the given anchor view ID.
android:layout_alignBottom   Makes the bottom edge of this view match the bottom edge of the given anchor view ID.
android:layout_alignLeft   Makes the left edge of this view match the left edge of the given anchor view ID.
android:layout_alignParentBottom   If true, makes the bottom edge of this view match the bottom edge of the parent.
android:layout_alignParentLeft   If true, makes the left edge of this view match the left edge of the parent.
android:layout_alignParentRight   If true, makes the right edge of this view match the right edge of the parent.
android:layout_alignParentTop   If true, makes the top edge of this view match the top edge of the parent.
android:layout_alignRight   Makes the right edge of this view match the right edge of the given anchor view ID.
android:layout_alignTop   Makes the top edge of this view match the top edge of the given anchor view ID.
android:layout_below   Positions the top edge of this view below the given anchor view ID.
android:layout_centerHorizontal   If true, centers this child horizontally within its parent.
android:layout_centerInParent   If true, centers this child horizontally and vertically within its parent.
android:layout_centerVertical   If true, centers this child vertically within its parent.
android:layout_toLeft   Positions the right edge of this view to the left of the given anchor view ID.
android:layout_toRight   Positions the left edge of this view to the right of the given anchor view ID.

我相信大家的英文水平，这段从API上抄下来的东西我就不翻译了。但是可以看出来，只要设置上面的属性（不一定要全部），我们可以轻松规定一个控件（View）的在相对定位下的显示行为。同时RelativeLayout是从layout上继承下来的，因此layout的很多属性也可以在这里使用，包括：android:layout_height, android:layout_width,
android:layout_marginBottom, android:layout_marginLeft, android:layout_marginRight, android:layout_marginTop。

这不由的让人联想到我们对HTML中元素定位的流行做法——div+float。在CSS中，如果我们要控制一个元素（通常是一个div）的显示，就要用到填充距属性（Padding-top、Padding-right、Padding-bottom、Padding-left）与边框属性（Border-top-width、Border-right-width、Border-bottom-width、Border-left- width、Border-width 、Border-color、Border-style、Border-top、Border-right、Border-bottom、Border- left、Width、Height、Float、Clear）。CSS并没有像Android的layout一样定义了很多对齐，但是通过float和 clear一样可以呈现出漂亮的网页（通过float完全可以实现Android中alignXXX与alignParentXXX的功能）。

同样的，XML的分层结构也和HTML的嵌套<div></div>极为相似，把layout从代码里分离也与CSS外部样式表的思想相同。据说WPF也是运用了外部XML文件来控制UI，看来都受到了启发。

另外，Android的layout与Swing的layout有很好的对应，但是我的J2SE学得很差，等我研究研究之后再进行分析和比较吧。

本文来自wodehuajianrui:http://www.cnblogs.com/wodehuajianrui/archive/2008/07/04/1235623.html