Android RelativeLayout布局

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/chennai1101/article/details/82022249

相关文章
Android LinearLayout布局
Android RelativeLayout布局
Android 自定义布局

1. RelativeLayout类

相对布局（RelativeLayout）将子视图以相对位置显示。默认显示在父视图的左上角。

• layout_alignParentTop，父视图的上边
• layout_alignParentBottom，父视图的下边
• layout_alignParentLeft，父视图的左边
• layout_alignParentRight，父视图的右边

设置4个子视图在边角位置。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- 左上角显示 -->
    <TextView
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:text="Default"
        android:gravity="center"
        android:background="#ffa6a5aa"/>
    <!-- 右上角显示 -->
    <TextView
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:text="Right"
        android:gravity="center"
        android:background="#ffa6a5aa"/>
    <!-- 左下角显示 -->
    <TextView
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:layout_alignParentBottom="true"
        android:text="Bottom"
        android:gravity="center"
        android:background="#ffa6a5aa"/>
    <!-- 右下角显示 -->
    <TextView
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        android:text="Right|Bottom"
        android:gravity="center"
        android:background="#ffa6a5aa"/>
</RelativeLayout>

效果如下

2. 居中显示

layout_centerXX可以在父视图内居中显示

• layout_centerInParent，相对于父视图完全居中
• layout_centerHorizontal，相对于父视图水平居中
• layout_centerVertical，相对于父视图垂直居中

可以配合alignParentXX使用

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:layout_width="120dp"
        android:layout_height="40dp"
        android:text="centerInParent"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_centerInParent="true"/>

    <TextView
        android:layout_width="120dp"
        android:layout_height="40dp"
        android:text="centerHorizontal"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_centerHorizontal="true"/>

    <TextView
        android:layout_width="120dp"
        android:layout_height="40dp"
        android:text="alignParentBottom"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"/>

    <TextView
        android:layout_width="120dp"
        android:layout_height="40dp"
        android:text="centerVertical"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_centerVertical="true"/>

    <TextView
        android:layout_width="120dp"
        android:layout_height="40dp"
        android:text="alignParentRight"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"/>

</RelativeLayout>

效果如下

3. 相对视图对齐

• layout_above，视图的下边与相对视图的上边对齐
• layout_below，视图的的上边与相对视图的下边对齐
• layout_toRightOf，视图的左边与相对视图的右边对齐
• layout_toLeftOf，视图的右边与相对视图的左边对齐

设置的子视图的相对位置，

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/tv_center"
        android:layout_width="150dp"
        android:layout_height="60dp"
        android:layout_centerInParent="true"
        android:text="center"
        android:background="#ffffcc00"
        android:gravity="center" />

    <TextView
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:text="above"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_above="@id/tv_center"/>

    <TextView
        android:layout_width="100dp"
        android:layout_height="40dp"
        android:text="below"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_below="@id/tv_center"/>

    <TextView
        android:layout_width="120dp"
        android:layout_height="40dp"
        android:text="toRightOf"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_toRightOf="@id/tv_center"/>

    <TextView
        android:layout_width="120dp"
        android:layout_height="40dp"
        android:text="toLeftOf"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_toLeftOf="@id/tv_center"/>

</RelativeLayout>

效果如下

4. 边对齐

• layout_alignTop，视图与基准视图的上边对齐
• layout_alignBottom：视图与基准视图的下边对齐
• layout_alignLeft：视图与基准视图的左边对齐
• layout_alignRight：视图与基准视图的右边对齐
• layout_alignBaseline：视图与基准视图的基准线对齐

设置的子视图某条边的对齐方式，

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/tv_center"
        android:layout_width="150dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        android:text="center"
        android:textSize="32sp"
        android:background="#ffffcc00"
        android:gravity="center" />

    <TextView
        android:layout_width="60dp"
        android:layout_height="20dp"
        android:text="alignTop"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_alignTop="@id/tv_center"/>

    <TextView
        android:layout_width="60dp"
        android:layout_height="20dp"
        android:text="alignBottom"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_alignBottom="@id/tv_center"/>

    <TextView
        android:layout_width="60dp"
        android:layout_height="20dp"
        android:text="alignLeft"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_alignLeft="@id/tv_center"/>

    <TextView
        android:layout_width="60dp"
        android:layout_height="20dp"
        android:text="alignRight"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_alignRight="@id/tv_center"/>


    <TextView
        android:layout_width="60dp"
        android:layout_height="20dp"
        android:text="alignBaseline"
        android:gravity="center"
        android:background="#ffa6a5aa"
        android:layout_alignBaseline="@id/tv_center"/>

</RelativeLayout>

效果如下