Android相对布局

1.RelativeLayout类简介

在相对布局中，子控件的位置是相对兄弟控件或父容器而决定的。处于性能考虑，在设计相对布局时要按照控件之间的依赖关系排列，如View A的位置相对于View B来决定，则需要保证在布局文件中View B在View A的前面。

在进行相对布局时用到的属性很多，首先来看属性值为true或false的属性，如下表所示。

属性名称	属性说明
android:layout_centerHorizontal	当前控件位于父控件的横向中间位置
android:layout_centerVertical	当前控件位于父控件的纵向中间位置
android:layout_centerInParent	当前控件位于父控件的中央位置
android:layout_alignParentBottom	当前控件低端与父控件低端对齐
android:layout_alignParentLeft	当前控件左侧与父控件左侧对齐
android:layout_alignParentRight	当前控件右侧与父控件右侧对齐
android:layout_alignParentTop	当前控件顶端与父控件顶端对齐
android:layout_alignWithParentIfMissing	参照控件不存在或不可见时参照父控件

接下来再来看属性值为其他控件id的属性，如下表所示。

属性名称	属性说明
android.layout_toRightOf	使当前控件位于给出id控件的右侧
android.layout_toLeftOf	使当前控件位于给出id控件的左侧
android.layout_above	使当前控件位于给出id控件的上方
android.layout_below	使当前控件位于给出id控件的下方
android.layout_alignTop	使当前控件的上边界与给出id控件的上边界对齐
android.layout_alignBottom	使当前控件的下边界与给出id控件的下边界对齐
android.layout_alignLeft	使当前控件的左边界与给出id控件的左边界对齐
android.layout_alignRight	使当前控件的有边界与给出id控件的有边界对齐

最后要介绍的是属性值以像素为单位的属性及说明。

属性名称	属性说明
android:layout_marginLeft	当前控件左侧的留白
android:layout_marginRight	当前控件右侧的留白
android:layout_marginTop	当前控件上方的留白
android:layout_marginBottom	当前控件下方的留白

需要注意的是在进行相对布局时要避免出现循环依赖，例如设置相对布局在父容器中的排列方式为WRAP_CONTENT，就不能再将相对布局的子控件设置为ALIGN_PARENT_BOTTOM。因为这样会造成子控件和父控件相互依赖和参照的错误。

2.相对布局案例

本节通过一个案例来说明RelativeLayout的用法，开发步骤如下。

1）新建一个项目Android_Sample_3_3。

2）打开res/values目录下的strings.xml，在其中输入如下代码。

  1: <?xml version="1.0" encoding="utf-8"?>
  2: <resources>     
  3:     <string name="app_name">RelativeExample</string>
  4:     <string name="pic_center">center</string>
  5:     <string name="pic_down">down</string>
  6:     <string name="pic_up">up</string>
  7: </resources>

3）将图片文件center.png,down,png,up.png放到res/drawable-mdpi目录下。

4）首先进行布局文件main.xml的开发。打开res/layout目录下的main.xml，将其中已有的代码替换成如下代码。

  1: <?xml version="1.0" encoding="utf-8"?>
  2: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3:     android:id="@+id/RelativeLayout01"
  4:     android:layout_width="fill_parent"
  5:     android:layout_height="fill_parent" >
  6: 
  7:     <ImageView
  8:         android:id="@+id/ImageView01"
  9:         android:layout_width="wrap_content"
 10:         android:layout_height="wrap_content"
 11:         android:layout_centerInParent="true"
 12:         android:background="@drawable/center"
 13:         android:contentDescription="@string/pic_center" >
 14:     </ImageView>
 15: 
 16:     <ImageView
 17:         android:id="@+id/ImageView02"
 18:         android:layout_width="wrap_content"
 19:         android:layout_height="wrap_content"
 20:         android:layout_alignTop="@id/ImageView01"
 21:         android:layout_toRightOf="@id/ImageView01"
 22:         android:background="@drawable/down"
 23:         android:contentDescription="@string/pic_down" >
 24:     </ImageView>
 25: 
 26:     <ImageView
 27:         android:id="@+id/ImageView03"
 28:         android:layout_width="wrap_content"
 29:         android:layout_height="wrap_content"
 30:         android:layout_above="@id/ImageView01"
 31:         android:layout_alignLeft="@id/ImageView01"
 32:         android:background="@drawable/up"
 33:         android:contentDescription="@string/pic_up" >
 34:     </ImageView>
 35: 
 36: </RelativeLayout>

第2～5行声明了一个相对布局，声明了其id及在父控件中的布局规划。

第7～14行声明了一个ImageView控件，并在代码第11行设置其位置属性android:layout_centerInParent为true，即该控件位于父控件的中央位置。

第16～24行声明了一个ImageView控件，并在代码第20和21行设置其位置属性android:layout_toRightOf和android:layout_alignTop均为ImageView01，即位于ImageView01的上方。

第26～34行声明了一个ImageView控件，并在代码第30和31行设置其位置属性android:layout_above和android:layout_alignLeft均为ImageView01，即位于ImageView01的上方。

5）接下来进行Activity部分的开发。打开项目的Activity文件 Android_Sample_3_3Activity.java ，在其中输入如下代码。默认情况下不需要做修改。

  1: package wyf.jc;
  2: 
  3: import android.app.Activity;
  4: import android.os.Bundle;
  5: 
  6: public class Android_Sample_3_3Activity extends Activity {
  7: 	@Override
  8: 	public void onCreate(Bundle savedInstanceState) {
  9: 		super.onCreate(savedInstanceState);
 10: 		setContentView(R.layout.main);
 11: 	}
 12: }

完成上述步骤的开发，下面运行本项目，如下图所示。

参照控件为屏幕中的南瓜图片，兔子图片相对于南瓜在其上方，而小猪图片相对于南瓜图片在其右方。

作者：银月莲
出处：http://www.cnblogs.com/moonsilvering
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，包括文章，代码，图片等本站内所有资源，否则保留追究法律责任的权利。