零、學習目標

1. 能說出相對布局常用的屬性
2. 能利用相對布局實現比較復雜的界面設計

一、相對布局

1、布局特點

在相對布局中，一個控件的位置取決于它和其它控件的相對關系。

• 優點：使用比較靈活。
• 缺點：復雜，掌握較難。

2、繼承關系圖

3、常用屬性

（1）相對于父容器居中

• layout_centerInParent 在父容器居中
• layout_centerHorizontal 在父容器水平居中
• layout_centerVertical 在父容器垂直居中

（2）相對于其它控件的位置

• layout_toLeftOf 在……左邊
• layout_toRightOf 在……右邊
• layout_above 在……上面
• layout_below 在……下面

（3）相對于其它控件對齊

• layout_alignLeft 與……左對齊
• layout_alignRight 與……右對齊
• layout_alignTop 與……頂對齊
• layout_alignBottom 與……底對齊
• layout_alignBaseLine 與……基線對齊

（4）相對于父容器對齊

• layout_alignParentLeft 與父容器左對齊
• layout_alignParentRight 與父容器右對齊
• layout_alignParentTop 與父容器頂對齊
• layout_alignParentBottom 與父容器底對齊

（5）標識符問題

• @+id/button —— 創建新的id（建議使用）
• @id/button —— 引用已有的id

二、教學案例 —— 相對布局演示

（一）運行效果

（二）實現步驟

1、創建安卓應用【RelativeLayoutDemo】

2、主布局資源文件activity_main.xml

分析界面：首先確定【中央】按鈕，然后其它按鈕可以根據與它的相對位置關系來定位。【左上角】按鈕、【右上角】按鈕、【左下角】按鈕與【右下角】按鈕可以根據它與父容器的對齊方式來確定。

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="net.hw.relative_layout_demo.MainActivity">

    <Button
        android:id="@+id/btn_center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="中央" />

    <Button
        android:id="@+id/btn_upper_left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@id/btn_center"
        android:layout_toLeftOf="@id/btn_center"
        android:text="左上" />

    <Button
        android:id="@+id/btn_upper_right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@id/btn_center"
        android:layout_toRightOf="@id/btn_center"
        android:text="右上" />

    <Button
        android:id="@+id/btn_lower_left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btn_center"
        android:layout_toLeftOf="@id/btn_center"
        android:text="左下" />

    <Button
        android:id="@+id/btn_lower_right"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btn_center"
        android:layout_toRightOf="@id/btn_center"
        android:text="右下" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@id/btn_lower_left"
        android:layout_below="@id/btn_lower_left"
        android:layout_marginTop="15dp"
        android:text="確定" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignRight="@id/btn_lower_right"
        android:layout_below="@id/btn_lower_right"
        android:layout_marginTop="15dp"
        android:text="取消" />

    <Button
        android:id="@+id/btn_upper_left_corner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="左上角" />

    <Button
        android:id="@+id/btn_upper_right_corner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:text="右上角" />

    <Button
        android:id="@+id/btn_lower_left_corner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:text="左下角" />


    <Button
        android:id="@+id/btn_lower_right_corner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:text="左下角" />
</RelativeLayout>

• 查看設計視圖
  

3、啟動應用，查看效果

三、課后作業

任務1、輸入姓名

• 想一想，在相對布局里，上述界面首先添加哪個控件？為什么？

任務2、用戶注冊

• 用戶注冊窗口
  
• 用戶注冊窗口——>顯示注冊信息窗口