[Android] RelativeLayout(상대적 레이아웃) 정리

RelativeLayout이란

상대 뷰의 위치를 기준으로 정렬하는 레이아웃 클래스이다. 즉, 화면에 이미 출력된 특정 뷰를 기준으로 방향을 지정하여 배치한다.

 

사용되는 속성

• android:layout_above : 기준 뷰의 위쪽에 배치
• android:layout_below : 기준 뷰의 아래쪽에 배치
• android:layout_toLeftOf : 기준 뷰의 왼쪽에 배치
• android:layout_toRightOf : 기준 뷰의 오른쪽에 배치

<?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=".MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/imageView"
        android:text="Hello" />
    
</RelativeLayout>

 

 

align 속성

상대 뷰의 어느 쪽에 맞춰서 정렬할지를 정하는 속성이다.

 

사용되는 속성

• android:layout_alignTop : 기준 뷰와 위쪽을 맞춤
• android:layout_alignBottom : 기준 뷰와 아래쪽을 맞춤
• android:layout_alignLeft : 기준 뷰와 왼쪽을 맞춤
• android:layout_alignRight : 기준 뷰와 오른쪽을 맞춤
• android:layout_alignBaseline : 기준 뷰와 텍스트 기준선을 맞춤

<?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=".MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@id/imageView"
        android:layout_toRightOf="@id/imageView"
        android:text="Hello" />

</RelativeLayout>

 

 

상위 레이아웃을 기준으로 맞춤 정렬하는 속성도 있다. 뷰를 부모영역의 오른쪽 또는 아래쪽에 붙이고 싶다면 사용하는 속성이다.

• android:layout_alignParentTop : 부모의 위쪽에 맞춤
• android:layout_alignParentBottom : 부모의 아래쪽에 맞춤
• android:layout_alignParentLeft : 부모의 왼쪽에 맞춤
• android:layout_alignParentRight : 부모의 오른쪽에 맞춤
• android:layout_centerHorizontal : 부모의 가로 방향 중앙에 맞춤
• android:layout_centerVertical : 부모의 세로 방향 중앙에 맞춤
• android:layout_centerInParent : 부모의 가로,세로 중앙에 맞춤

<?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=".MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@id/imageView"
        android:layout_alignParentRight="true"
        android:text="Hello" />

</RelativeLayout>

 

 

참고

https://developer.android.com/guide/topics/ui/layout/relative?hl=ko

상대적 레이아웃  |  Android 개발자  |  Android Developers