안드로이드 RelativeLayout 컨테이너 (Android Container 2: RelativeLayout)

 RelativeLayout

RelativeLayout은 위젯의 위치를 상대 위젯/ 컨테이너를 기준으로 결정하는 방법이다.

 

 

첫 번째로, 부모 컨테이너 내부에서 위젯 자신의 위치를 결정하는 속성은 다음과 같다.

위의 속성들은 모두 true, false 값을 입력 받는다.

 

 

두 번째로, 상대 위젯/컨테이너를 기준으로 배치 시 사용하는 속성은 다음과 같다.

마지막 android:layout_alignBaseline는 label과 EditText등의 Text기반 위젯의 글자 높이를 맞추는데 유용하게 쓰임.

위의 모든 attribute들은 기준이 되는 상대 위젯/컨테이너의 id를 값으로 지정하여야 한다.

 

기준이 되는 상대 위젯의 id는 "@id/위젯id"로 결정한다.

예를들어, 위젯 A 가 android:id="@+id/A"로 identiy되어있다면XML 내부에서 위젯 A는 "@id/A"로 불린다.

그럼으로 위젯 B를 위젯 A 오른쪽에 위치 하게 하고 싶다면 위젯 B의 alignment 속성을 다음과 같이 지정한다.

<위젯 A 

......

android:id="@+id/A" />

<위젯 B

......

android:layout_alignRightOf="@id/A" />

 

이 경우 위젯 A, B는 다음과 같은 형태로 배치 된다.

 

 

RelativeLayout에서 주의할 두 가지 점은:

• XML Layout 파일은 위에서 아래로 순차적으로 한번 파싱됨으로 XML 문서상 밑에 위치한 위젯의 id를 위에 위치한 위젯이 참고하는 것은 불가능 하다. (아직 선언되지 않은 변수를 참조 할 수 없는 것과 같다.)
• 모든 fill 관련 속성은 자신 이외의 위젯이 사용하고 남은 스페이스에만 적용됨.

 

 

RelativeLayout 예제 (main.xml)

view source

print?

01	<?xml version="1.0" encoding="utf-8"?>

02	<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

03	android:layout_width="fill_parent"

04	android:layout_height="fill_parent"

05	android:padding="5px" >

06	<!-- XML layout은 위에서 부터 밑으로 parsing 됨으로  -->

07	<!-- 다음의 TextView내부에서 아직 선언되지 않은   -->

08	<!-- EditText나 Button들의 id(@id/edittext, @id/ok, @id/cancel)를 사용할 수 없음  -->

09

<TextView

10	android:id="@+id/label"

11	android:layout_width="wrap_content"

12	android:layout_height="wrap_content"

13	android:text="URL"

14	android:paddingTop="15px"

15	android:paddingRight="10px" />

16	<!-- 다음의 EditText(edittext)의 layout_width="fill_parent"는 -->

17	<!-- 위 TextView(lable)가 사용하고 남은 공간을 채움 -->

18

<EditText

19	android:id="@+id/edittext"

20	android:layout_width="fill_parent"

21	android:layout_height="wrap_content"

22	android:layout_toRightOf="@id/label"

23	android:layout_alignBaseline="@id/label"

24	android:text="http://tigerwoods.tistory.com" />

25

<Button

26	android:id="@+id/ok"

27	android:layout_width="80px"

28	android:layout_height="wrap_content"

29	android:layout_alignRight="@id/edittext"

30	android:layout_below="@id/edittext"

31	android:text="OK" />

32

<Button

33	android:id="@+id/cancel"

34	android:layout_width="80px"

35	android:layout_height="wrap_content"

36	android:layout_toLeftOf="@id/ok"

37	android:layout_below="@id/edittext"

38	android:text="Cancel" />

39	</RelativeLayout>

 

 

실행결과는 다음과 같다.