Android用户界面设计(2)：相对布局

1、Android用户界面设计：相对布局探讨相对布局的重要特性和属性现在让我们来讨论一些帮助配置相对布局和它的子控件的属性。一些特定的属性用于相对布局，也就是子规则，包括： 用于子控件在父布局中居中的规则，包括：水平居中，垂直居中，或者两者皆居中。 用于子控件在父布局中排布的规则，包括：在顶部，底部，左，右边缘放置。 用于子控件相对于其它子控件排布的规则，包括：在另一个控件顶，底，左，右边缘放置。 用于子控件相对于其它子控件放置的规则，包括：在另一个控件上面，底下，左边或右边放置。同样的，通用的 ViewGroup-style属性也可以应用于相对布局。这些属性包括： 通用布局参数比如layout_

2、height（必须）和layout_width（必须）（类：ViewGroup.LayoutParams） 边距布局参数比如margin_top, margin_left, margin_right和margin_bottom (类：ViewGroup. MarginLayoutParams) 布局参数比如layout_height和layout_width (类：ViewGroup.LayoutParams)现在让我们来实践这些规则吧！使用布局规则让我们看一个更复杂的屏幕设计。为了这个练习，我们从查看最终屏幕效果开始，然后再倒回来工作，并讨论这个相对布局的特性和为了达到最终结果所使用的规则。

3、我们希望设计一个如下所示的屏幕：为了使用相对布局来设计这个屏幕，参考以下步骤。步骤1：在你的XML资源文件中定义一个相对布局首先，在你的XML资源文件中定义一个相对布局。因为你想这个布局控制整个屏幕的内容，所以设置它的高和宽属性为fill_parent。你的XML资源文件应该看起来像这样： 以下是代码片段：<?xml version="1.0" encoding="utf-8"?><RelativeLayoutxmlns:android="android:layout_height="fill_parent"

4、;android:layout_width="fill_parent"></RelativeLayout>步骤2：确定子控件接下来，我们确定需要什么样的子控件。在这里，我们需要7个TextView控件（第个一种颜色）。像平常一样配置它们，设置文本属性为字符串，背景色，字号等等。将这些控件都放到相对布局中。步骤3：定义相对布局规则接下来，我们为每个子控件定义规则，以使它们被绘制到合适的位置： RED TextView控件没有特别的设置。默认地，这个控件将会被绘制到父布局的左上角。 ORANGE TextView控件在父布局中水平居中。因为所有控件默认都会靠向

5、屏幕的左上角，这有效地将控件定位到父布局的边缘顶部中间。 YELLOW TextView控件定位到父布局的右边缘。因为所有控件默认都会靠向屏幕的左上角，这有效的定位控件到父布局的右上角。 GREEN TextView控件在父布局中垂直居中，并且设置为显示在BLUE TextView控件的左边。 BLUE TextView控件被定位在父控件的中心（水平和垂直）。这将它显示在屏幕的中心位置。 INDIGO TextView控件在父局中垂直居中，并且设置为显示在BLUE TextView控件的右边。 VIOLET TextView控件被定位到父布局的底部边缘。它的宽度也被设置为填满父容器，允许它延伸

6、到屏幕的底部边缘。如果你在你的XML资源文件中定义这些规则，XML文件代码将看起如下： 以下是代码片段：<?xml version="1.0" encoding="utf-8"?><RelativeLayoutxmlns:android="android:layout_height="fill_parent"android:layout_width="fill_parent"><TextViewandroid:text="RED"android:id=&q

7、uot;+id/TextView01"android:layout_height="wrap_content" android:background="#f00"android:gravity="center"android:textColor="#000"android:layout_width="wrap_content" android:padding="25dp"></TextView><TextViewandroid:text=&q

8、uot;ORANGE"android:layout_height="wrap_content" android:background="#ffa500"android:gravity="center"android:textColor="#000"android:id="+id/TextView02"android:layout_width="wrap_content" android:layout_centerHorizontal="true"

9、 android:padding="25dp"></TextView><TextViewandroid:text="YELLOW"android:layout_height="wrap_content" android:background="#ffff00"android:gravity="center"android:textColor="#000"android:id="+id/TextView03"android:layou

10、t_width="wrap_content" android:layout_alignParentRight="true" android:padding="25dp"></TextView><TextViewandroid:text="GREEN"android:layout_height="wrap_content" android:background="#0f0"android:gravity="center"android

11、:textColor="#000"android:id="+id/TextView04"android:layout_width="wrap_content"android:layout_toLeftOf="+id/TextView05" android:padding="25dp"android:layout_centerVertical="true"></TextView><TextViewandroid:text="BLUE"

12、android:layout_height="wrap_content"android:background="#00f"android:gravity="center"android:textColor="#fff"android:id="+id/TextView05"android:layout_width="wrap_content"android:layout_centerInParent="true"android:layout_margin=&

13、quot;10dp"android:padding="25dp"></TextView><TextViewandroid:text="INDIGO"android:layout_height="wrap_content"android:gravity="center"android:textColor="#fff"android:id="+id/TextView06"android:layout_width="wrap_conten

14、t"android:layout_toRightOf="+id/TextView05"android:background="#4b0082"android:padding="25dp"android:layout_centerVertical="true"></TextView><TextViewandroid:text="VIOLET"android:layout_height="wrap_content"android:backgrou

15、nd="#ee82ee"android:gravity="center"android:textColor="#000"android:id="+id/TextView07"android:layout_alignParentBottom="true"android:layout_width="fill_parent"android:padding="25dp"></TextView></RelativeLayout>相对布局使用技巧这里是一些使用相对布局的技巧。 相对布局的子控件必须有唯一的id属性以使规则正确应用。 当心循环规则。循环规则发生在两个控件具有互相指向的规则时。如果你在布局设计中使用了循环规则，你将会得到以下错误信息：IllegalStateException: Circular dependencies cannot exist in a RelativeLayout（相对布局中不允许存在循环依赖） 回忆一下相对布局规则的应用被一次处理是很有用的 保持你的相对布局规则最小化。这减小了循环规则的机率并且使得你的布局更加可维护和灵活。 一般地，记住测试一下你的布局设计在横屏和竖屏模式