Relative Layout에 대하여

Relative Layout 이란?

RelativeLayout은 상대 위치에 하위 뷰를 표시하는 뷰 그룹입니다.[1]
화면에 이미 출력된 특정 뷰를 기준으로 방향을 지정하여 배치합니다.

RelativeLayout을 사용하면 하위 뷰는 상위 뷰 또는 서로 다른 뷰(ID로 구분)에 상대적인 위치를 지정할 수 있습니다. 따라서 두 요소를 오른쪽 테두리로 정렬하거나 위아래로 나란히, 화면 중앙에, 왼쪽 가운데 등으로 정렬할 수 있습니다. 기본적으로 모든 하위 뷰는 레이아웃의 왼쪽 상단에 그려지므로 RelativeLayout.LayoutParams에서 사용할 수 있는 다양한 레이아웃 속성을 사용하여 각 뷰의 위치를 정의해야 합니다.

 

• android:layout_above: 기준 뷰의 위쪽에 배치
• android:layout_below: 기준 뷰의 아래쪽에 배치
• android:layout_toLeftOf : 기준 뷰의 왼쪽에 배치
• android:layout_toRightOf : 기준 뷰의 오른쪽에 배치
• 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">
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="1번"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true" />
 
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="2번"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />
 
    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="3번"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true" />
 
    <Button
        android:id="@+id/button4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="4번"
        android:layout_centerVertical="true" />
 
    <Button
        android:id="@+id/button5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="5번"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"/>
 
    <Button
        android:id="@+id/button6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="6번"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"/>
 
    <Button
        android:id="@+id/button7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="7번"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"/>
 
    <Button
        android:id="@+id/button8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="8번"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"/>
 
    <Button
        android:id="@+id/button9"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="9번"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"/>
 
</RelativeLayout>

 

 

<실습화면>

 

 

[4]

 

참조

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

[2] https://velog.io/@realhsb/%EC%95%88%EB%93%9C%EB%A1%9C%EC%9D%B4%EB%93%9C-%EB%A0%88%EC%9D%B4%EC%95%84%EC%9B%83-%EC%83%81%EB%8C%80-%EC%9C%84%EC%B9%98%EB%A1%9C-%EB%B0%B0%EC%B9%98-RelativeLayout

[3] https://kangchobo.tistory.com/28

[4] https://codechacha.com/ko/relativelayout/