[ 안드로이드 개발 2.0 ] RelativeLayout 출력하기

[ 안드로이드 개발 2.0 ] RelativeLayout 출력하기

RelativeLayout은 버튼이나 텍스트박스 같은 구성요소들의 위치를 서로 상대적(Relative)으로 배치 할 수 있는 레이아웃입니다.

안드로이드 개발자사이트의 내용을 참고하여 진행합니다.

1. 다음과 같이 프로젝트를 생성합니다.

2. res > layout > main.xml 파일을 엽니다.

3. 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:background="@android:drawable/editbox_background"


        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>

4. Run -> Run 을 선택하여 실행합니다.

[ RelativeLayout 실행 결과화면 ]


xml 코드를 살펴보겠습니다.

android:id="@+id/label"  => label 입니다.
android:text="Type here:"  => label에 쓰여질 텍스트입니다.

android:layout_below="@id/label" => label 아래에 위치하게 합니다.
android:layout_alignParentRight="true" => 부모요소의 오른쪽끝에 맞춥니다. OK버튼이 텍스트뷰의 오른쪽에 맞추어져 있습니다.

android:layout_toLeftOf="@id/ok" => OK버튼의 왼쪽에 위치합니다. 

다음은 이름과 주소를 입력하도록 약간 수정한 코드와 결과입니다.

[수정한 코드]

<?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="이름과 주소를 입력하세요"/>

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

    <EditText
        android:id="@+id/entry2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/entry"
        android:background="@android:drawable/editbox_background"
        />
    <Button
        android:id="@+id/ok"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/entry2"
        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>

[ 실행결과 ]