相对布局（上）

相对布局的好处：

不会多层嵌套，使得UI的性能提高。线性布局需要实现多层嵌套，导致UI性能降低。UI布局嵌套的越高，性能就越低。

主要内容：

1   什么是相对布局(RelativeLayout)  
2   为什么要使用相对布局  
3   相对布局的两组常用属性 

什么是相对布局：

1   相对布局是另外一种控件摆放的方式  
2   相对布局是通过指定当前控件与兄弟控件或者是父控件之间的相对位置,从而达到控制控件位置的目的。

相对布局的基本思路：
先确定一个控件的位置，然后再确定第二个，第3个。。。。第一个控件默认是放置在相对布局的左上角的位置。

如下所示：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#FF0000"        android:text="first TextView" /></RelativeLayout>

如果再写一个TextView，就会将第一个TextView覆盖：

如下所示：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#FF0000"        android:text="first TextView" />    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#00FF00"        android:text="second TextView" /></RelativeLayout>

下面就需要使用到相对布局的一些属性了：

第一组：

1   android:layout_below   在之前控件的下面
2   android:layout_above  在之前控件的上面
3   android:layout_toLeftOf  在之前控件的左边
4   android:layout_toRightOf 在之前控件的右边

试验一下：android:layout_below，android:layout_above

使用android:layout_below

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <TextView        android:id="@+id/firstView"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#FF0000"        android:text="first TextView" />    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#00FF00"        android:layout_below="@id/firstView"        android:text="second TextView" /></RelativeLayout>

发现第二个在第一个的下面：

使用android:layout_above，

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <TextView        android:id="@+id/firstView"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#FF0000"        android:text="first TextView" />    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#00FF00"        android:layout_above="@id/firstView"        android:text="second TextView" /></RelativeLayout>

发现有一个向下的箭头，说明，第二个TextView跑到了第一个TextView的上面，屏幕之外了。

其他类似。

第二组：

1   android:layout_alignLeft     左边对齐
2   android:layout_alignRight  右边对齐
3   android:layout_alignTop    上边对齐
4   android:layout_alignBottom 下边对齐

举例：android:layout_alignLeft android:layout_alignRight （其他类似）

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent" >    <TextView        android:id="@+id/firstView"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#FF0000"        android:text="first TextView" />    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:background="#00FF00"        android:layout_alignLeft="@id/firstView"        android:text="TextView" /></RelativeLayout>

效果：

我把第二个TextView写的少一点，可以看到它们是对边进行对齐，有可能覆盖之前的内容。其他类似

总结:

设置布局的值都是另一个控件的id

android:layout_below="@id/firstView"

+id表示创建一个新的id
不加+表示直接使用已经存在的id