RelativeLayout (상대적 배치 방식)

RelativeLayout (상대적 배치 방식)

 

RelativeLayout은 자식 뷰들을 상대적인 관계에 따라 배치하고자 할 때 사용된다.

 

부모 객체를 기준으로 배치 (true / false)
android:layout_alignParentTop		부모 객체의 상단 가장자리에 해당 위젯을 배치한다.
android:layout_alignParentBottom		부모 객체의 하단 가장자리에 해당 위젯을 배치한다.
android:layout_alignParentLeft		부모 객체의 왼쪽 가장자리에 해당 위젯을 배치한다.
android:layout_alignParentRight		부모 객체의 오른쪽 가장자리에 해당 위젯을 배치한다.
android:layout_centerHorizontal		부모 객체의 가로 방향 중앙부에 해당 위젯을 배치한다.
android:layout_centerVertical		부모 객체의 세로 방향 중앙부에 해당 위젯을 배치한다.
android:layout_centerInParent		부모 객체의 정중앙에 해당 위젯을 배치한다.

 

별도의 위젯을 기준으로 배치 (기준 위젯의 ID 지정)
android:layout_above	ID로 지정된 기준 위젯의 위에 해당 위젯을 배치한다.
android:layout_below	ID로 지정된 기준 위젯의 아래에 해당 위젯을 배치한다.
android:layout_toLeftOf	ID로 지정된 기준 위젯의 왼쪽에 해당 위젯을 배치한다.
android:layout_toRightOf	ID로 지정된 기준 위젯의 오른쪽에 해당 위젯을 배치한다.
android:layout_alignTop	ID로 지정된 기준 위젯과 상단 위치가 일치하도록 해당 위젯을 배치한다.
android:layout_alignBottom	ID로 지정된 기준 위젯과 하단 위치가 일치하도록 해당 위젯을 배치한다.
android:layout_alignLeft	ID로 지정된 기준 위젯과 왼쪽 위치가 일치하도록 해당 위젯을 배치한다.
android:layout_alignRight	ID로 지정된 기준 위젯과 오른쪽 위치가 일치하도록 해당 위젯을 배치한다.
android:layout_alignBaseline	ID로 지정된 기준 위젯과 텍스트 기준선이 일치하도록 해당 위젯을 배치한다.

 

RelativeLayout 예제 #1

< /res/layout/main.xml >

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <EditText
        android:id="@+id/EditText01"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"/>

    <Button
        android:id="@+id/Button01"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Button"
        android:layout_alignParentBottom="true"/>

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/image"
        android:scaleType="fitXY"
        android:layout_below="@id/EditText01"
        android:layout_above="@id/Button01"/>

</RelativeLayout>

// android:layout_alignParentTop="true"
//     => EditText을 부모 객체의 상단에 배치한다.
// android:layout_alignParentBottom="true"
//     => Button을 부모 객체의 하단에 배치한다.
// android:layout_below="@id/EditText01"
// android:layout_above="@id/Button01"
//     => ImageView를 EditText보다는 아래에,
//         Button보다는 위에 배치한다.

 

< RUN >

 

RelativeLayout 예제 #2

< /res/layout/main.xml >

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView
        android:id="@+id/label"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Type here:"/>

    <EditText
        android:id="@+id/entry"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/label"/>

    <Button
        android:id="@+id/ok"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/entry"
        android:layout_alignParentRight="true"
        android:layout_marginLeft="10dip"
        android:text="OK" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@id/ok"
        android:layout_alignTop="@id/ok"
        android:text="Cancel" />

</RelativeLayout>

// android:layout_below="@id/label"
//     => label 아래에 editbox를 놓는다.
// android:layout_below="@id/entry"
//     => editbox 아래에 OK 버튼을 놓는다.
// android:layout_alignParentRight="true"
//     => OK 버튼을 부모 객체의 오른쪽 가장자리에 정렬한다.
// android:layout_marginLeft="10dip"
//     => OK 버튼의 왼쪽 여분 공간을 설정한다.
// android:layout_toLeftOf="@id/ok"
//     => OK 버튼의 바로 왼쪽에 Cancel 버튼을 놓는다.
// android:layout_alignTop="@id/ok"
//     => OK 및 Cancel 두 버튼을 위로 정렬한다.

 

< RUN >