3-2 Android UI - Layout _Relative Layout

강의 3.48초부터

Relative Layout 

Relative(관계있는)Layout.

뷰를 서로 간의 위치 관계나, 컨테이너와의 위치 관계를 지정하여 배치하는 레이아웃.

 

예를들어, Relative Layout은

이런식으로, 배치를 할 수  있다 

(뭐는 ~ 뭐 옆에 배치 / 뭐 아래 배치 이런식 말이다.)

이렇게 되면 화면이 커지든 작아지든, 가로가 되든 세로가되든 무조건 B는 A의 오른쪽에 있을거고,

D는 C의 아래있을 것이다.

 

이렇게 위젯과의 관계도 설정하지만,

---

 

만약 RelativeLayout안에 A라는 애가 있다면

Parent가 RelativeLayout(위 그림에서 두꺼운 검은 라인 박스) 라 하면 

A라는 애를 왼쪽 정렬! 

B라는 애는 가운데 정렬!

 

하면 화면 크기가 어떻든 항상 A는 왼쪽, B는 가운데 위치하게 될 것이다.

---

 

만약, RelativeLayout의 자식(Children)들에 "상대적인" 배치 기준을 정하지 않는다면 , 중첩되어 표시된다.

---

그래서 이 관계를 지정하는 주요 속성에 대해 알아보겠다.

 

-위젯끼리의 관계를 지정하는 속성 : anchor의 id를 지정

속성	설명
layout_alignBaseline	anchor view와 baselin을 맞춘다
layout_alignBottom	anchor view와 아래쪽 가장자리를 맞춘다
layout_alignTop	anchor view와 위쪽 가장자리를 맞춘다
layout_alignLeft	anchor view와 왼쪽 가장자리를 맞춘다
layout_alignRight	anchor view와 오른쪽 가장자리를 맞춘다
layout_Above	anchor view의 위쪽에 배치
layout_Below	anchor view의 아래쪽에 배치
layout_toLeftOf	anchor view의 왼쪽에 배치
layout_toRightOf	anchor view의 오른쪽에 배치

 

 

- Parent와의 관계 지정하는 속성

속성	설명
layout_centerHorizontal	수평 방향으로 컨테이너의 가운데 배치
layout_centerVertical	수직 방향으로 컨테이너의 가운데 배치 (layout_centerInParent)
layout_alignParentLeft	컨테이너와 왼쪽 가장자리를 맞춘다
layout_alignParentRight	컨테이너와 오른쪽 가장자리를 맞춘다
layout_alignParentBottom	컨테이너와 아래쪽 가장자리를 맞춘다
layout_alignParentTop	컨테이너와 위쪽 가장자리를 맞춘다

---

▼직접 해보는 시간 

이런식으로 버튼을 배열해 봅시다.

 

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:id="@+id/button1"/>
    

</RelativeLayout>

▼결과

 

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:id="@+id/button1"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button2"
        android:id="@+id/button2"
        android:layout_toLeftOf="@id/button1"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_below="@id/button1"
        android:text="Button3"
        android:id="@+id/button3"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button4"
        android:layout_alignParentRight="true"
        android:layout_below="@id/button3"/>


</RelativeLayout>

 

 

오예 재밋다 재밌옹 ㄴ'ㅇ'