[Android] 안드로이드 레이아웃 - RelativeLayout(렐러티브 레이아웃) 사용 방법

안녕하세요 LinearLayout에 이어 다음 사용해 볼 레이아웃은 Relative Layout입니다. 혹시 LinearLayout의 사용 방법도 궁금하다면 아래 글을 보시면 됩니다!

[Android] 안드로이드 레이아웃 - LinearLayout(리니어 레이아웃) 사용 방법

Relative Layout은 특정 요소에 대한 상대적인 배치를 지정할 수 있는 레이아웃입니다.

 

예를 들자면

View1의 위 / 아래 / 좌 / 우에 View2를 배치 
View1의 위 / 아래 / 좌 / 우에 View2를 배치하고 View2를 좌 / 우로 정렬
View를 가운데에 배치

처럼 사용을 할 수 있습니다. 그러면 Relative Layout에서 사용할 수 있는 속성들을 살펴보겠습니다.

<!-- View의 상대적인 위치 -->
layout_toLeftOf="@id/view"		<!-- view의 왼쪽에 배치 -->
layout_toRightOf="@id/view"		<!-- view의 오른쪽에 배치 -->
layout_toStartOf="@id/view"		<!-- view의 시작에 배치 -->
layout_toEndOf="@id/view"		<!-- view의 끝에 배치 -->
layout_aboveOf="@id/view"		<!-- view의 위에 배치 -->
layout_belowOf="@id/view"		<!-- view의 아래에 배치 -->

layout_alignRight="@id/view"		<!-- view의 오른쪽라인에 맞춤 -->
layout_alignEnd="@id/view"		<!-- view의 끝라인에 맞춤 -->
layout_alignLeft="@id/view"		<!-- view의 왼쪽라인에 맞춤 -->
layout_alignStart="@id/view"		<!-- view의 시작라인에 맞춤 -->
layout_alignTop="@id/view"		<!-- view의 윗라인에 맞춤 -->
layout_alignBottom="@id/view"		<!-- view의 아래라인에 맞춤 -->
layout_alignBaseline="@id/view"		<!-- view의 기본라인에 맞춤 -->

<!-- RelativeLayout의 상대위치 -->
layout_alignParentLeft="true"	<!-- 부모의 왼쪽에 배치 -->
layout_alignParentRight="true"	<!-- 부모의 오른쪽에 배치 -->
layout_alignParentStart="true"	<!-- 부모의 시작에 배치 -->
layout_alignParentEnd="true"	<!-- 부모의 끝에 배치 -->
layout_alignParentTop="true"	<!-- 부모의 윗쪽에 배치 -->
layout_alignParentBottom="true"	<!-- 부모의 아랫쪽에 배치 -->
layout_centerInParent="true"	<!-- 부모의 가운데 배치 -->
layout_centerHorizontal="true"	<!-- 부모의 수평 가운데 배치 -->
layout_centerVertical="true"	<!-- 부모의 수직 가운데 배치 -->

위의 속성들을 이용하여 View들의 위치를 배치할 수 있습니다.

 속성들을 보면 Start와 Left, End와 Right의 차이가 무엇인지 궁금하실 겁니다. LTR(Left to Right) 언어를 사용하는 우리나라의 기준에는 둘 다 동일한 속성입니다. 하지만 RTL(Right to Left)의 문화를 가진 나라에서는 반대가 됩니다. 즉 Start는 Right와 End는 Left와 동일하게 되죠. 이러한 문화를 가진 언어를 구글에서 지원하게 되면서 기존의 Left, Right가 아닌 Start와 End를 사용하도록 유도하고 있습니다. Left, Right를 사용하면 경고가 뜨며 Start와 End를 사용하라고 합니다. 그럼 Start와 End를 사용하면 우리나라는 동일하게 표현이 되지만 RTL언어를 사용하는 나라에서는 Layout이 자동으로 뒤바뀌어 표현이 됩니다.

 

그러면 위의 속성들을 사용하여 간단한 예시를 만들어 보겠습니다.

Relative Layout Example

<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"
    android:background="#2a222222"
    tools:context=".MainActivity">

    <View
        android:id="@+id/view1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        android:background="#7461ac" />

    <View
        android:id="@+id/view2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_alignParentBottom="true"
        android:layout_toStartOf="@id/view1"
        android:background="#999999" />

    <View
        android:id="@+id/view3"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_above="@id/view1"
        android:layout_toStartOf="@id/view5"
        android:background="#a015bb" />

    <View
        android:id="@+id/view4"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_alignBottom="@id/view3"
        android:layout_alignParentEnd="true"
        android:background="#113366" />

    <View
        android:id="@+id/view5"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_below="@id/view1"
        android:layout_toStartOf="@id/view4"
        android:background="#77aa00" />
</RelativeLayout>

 

이번에 Relative Layout에 대해 알아보았습니다. 다음에는 이와 비슷한 Layout인 ConstraintLayout에 대해 알아보겠습니다.

 

다른 궁금한 점, 잘못된 점이 있다면 댓글을 남겨주세요!