Android学习之RelativeLayout(相对布局)

目录

同层次元素间定位

 margin和padding属性

---

本篇文章基于对基本属性熟悉的前提下

同层次元素间定位

相对布局的重要点就是如何根据其他同层次的的兄弟元素来进行定位本元素。

实例一(十字形排布)：

activity_main.xml文件中代码

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/RelativeLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <!-- center -->

    <ImageView
        android:id="@+id/img1"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_centerInParent="true"
        android:src="@drawable/image1"
        />

    <!-- location in left of middle image -->
    <ImageView
        android:id="@+id/img2"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_toLeftOf="@id/img1"
        android:layout_centerVertical="true"
        android:src="@drawable/image2"
        />

    <!-- location in right of middle image -->
    <ImageView
        android:id="@+id/img3"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_toRightOf="@id/img1"
        android:layout_centerVertical="true"
        android:src="@drawable/image3"
        />

    <!-- location in above of middle image -->
    <ImageView
        android:id="@+id/img4"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_above="@id/img1"
        android:layout_centerHorizontal="true"
        android:src="@drawable/image4"
        />

    <!-- location in under of middle image -->
    <ImageView
        android:id="@+id/img5"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:layout_below="@id/img1"
        android:layout_centerHorizontal="true"
        android:src="@drawable/image5"
        />

</RelativeLayout>

结果如下：

 margin和padding属性

实例二：

activity_main.xml文件如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/RelativeLayoutParent"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >


    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/btn1"
        android:textAllCaps="false" />

    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/btn1"
        android:text="@string/btn2"
        android:textAllCaps="false"
        android:layout_marginLeft="100dp"/>

    <Button
        android:id="@+id/btn3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btn1"
        android:text="@string/btn3"
        android:textAllCaps="false"
        android:paddingTop="100dp"/>
</RelativeLayout>

结果如下：

margin属性针对同一层次中两个相对元素间的偏移，padding属性针对同一层次中一个元素相对于另一元素在该元素本身需要的填充

实例三(margin为负值)：

activity_main.xml文件如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/RelativeLayoutParent"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        app:srcCompat="@mipmap/ic_launcher_round" />

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="14dp"
        android:layout_height="14dp"
        android:layout_alignRight="@id/imageView2"
        android:layout_alignTop="@id/imageView2"
        android:layout_marginTop="-9dp"
        android:layout_marginRight="-9dp"
        app:srcCompat="@android:drawable/ic_delete" />
</RelativeLayout>

结果如下：