2010년 8월 4일 수요일

안드로이드 레이아웃

Hierarchy of Screen Elements

 

개요 : 안드로이드 의 기본 클래스는 Activity(android.app.Activity) 클래스임.

Activity 클래스는 아주 많은 것을 할 수 있지만 지 혼자서는 화면에 아무짓도 못한다.

Activity 클래스에 화면기능을 하기 위해서는 View, Viewgroups 와 항상 같이 작업을

해줘야 한다.

 

1.  Views

View(android.view.View) 클래스는 화면의 사각형 영역에 있는 컨텐츠나 화면 레이아웃 을

담당한다.

즉 화면영역에 오브젝트들을 배치하고,위치를 재고,그리고,포커싱을 바꾸고,스크롤을 하는등의

일을 한다.

또한 View 클래스는 위젯(화면에 어떤 것을 그리는 모든 행위를 하는 클래스들의 집합)

기본 클래스이며, 이 위젯에 해당하는 클래스들로는 Text, EditText, InputMethod

, MovementMethod, Button, RadioButton, Checkbox, and ScrollView. 등이 있다.

 

2.  Viewgroups

Viewgroup(android.view.Viewgroup) 은 화면의 Layout 이다. 즉 각각의 View 들을 합쳐서

전체 구조를 그리고 화면의 전체 Layout 을 그려낸다.

 

3.  A Tree-Structured UI

Activity User Interface View Viewgroup 을 이용한 Tree 형태로 구성할 수 있다.


                                                                               [그림 – 1] A Tree

그림에서 보듯이 Viewgroup 이 다수의 View 를 포함하고 있고 Viewgrpup 도 포함하고

있는 것을 볼 수 있다.

예를 들면 RadioButton 컴포넌트를 여러개 둔 하나의 Viewgroup 을 만들수 있는 것이다.

이렇게 구성된 Tree 구조물을 화면에 표현하기 위해서 Activity 클래스의 setContentView()

메쏘드를 호출한다.

여기서, Activity 가 시스템으로부터 화면을 그려라, 또는 포커싱을 하라는 등의 노티를 받게 되면

트리의 최상위 root node 로 드로잉(Draw()) 요청을 하게된다. Root node 는 요청을 받게

되면 하위 child node 까지 모두 드로잉 하라는 명령을 전달하게 된다.

 

4.  LayoutParams: How a Child Specifies Its Position and Size

모든 Viewgroup ViewGroup.LayoutParams 를 상속받은 nested class 를 사용한다.

이 서브클래스 는 하위 클래스의 크기,위치,프로퍼티 등을 정의한다.

 


                                                 [그림-2] LayoutParams

모든 Viewgroup width height 를 가지고 있으며 다수의 Viewgroup border, margin

값을 가지고도 있다.

 

 

Common Layout Objects

 

다음으로는 어플리케이션에서 사용할수 있는 대부분의 Viewgroup 에 대해서 알아본다.

 

1.  FrameLayout

FrameLayout 은 가장 단순한 layout 중에 하나이다. 이 레이아웃은 빈 레이아웃 으로서

나중에 객체 하나를 넣을수 있게 되어있다. 얘를 들면 사진을 보여주는 틀에서 사진만

계속 교체되는 형태로 이 틀이 FrameLayout 이다.

 

 

 

 

 

2.  LinearLayout

LinearLayout 은 이름에서 볼수 있듯이 모든 children 을 한줄로 정렬하는 기능이다.

Children(child noed 의 콤포넌트) 사이의 마진, 그리고 gravity(좌우중 정렬,) 도 제공한다.

그리고 LinearLayout 에는 weight 라는 개념이 있는데, weight 는 각 컴포넌트 들이

빈공간을 얼마나 미리 확장 시켜놓을수 있느냐 에 대한 설정 값이다.

쉽게 얘기하면 Html 에서 textbox 를 하나 만들고 태그로 size 를 줘서 미리 입력

사이즈를 확보하는 것과 같은 개념이다.

 

아래 그림을 예로 들면

/우 그림모두 gravity left 이며, 좌측 은 weight 가 모두 디폴트값(0) 로 세팅

되어있다. Textbox Width FILL_PARENT(풀화면) 로 세팅되어 있고, 나머지 콤포넌트는

WRAP_CONTENT 로 세팅되어 있다.

반면 우측그림의 Comments textbox weight 1 로 세팅되어 있다.

Name textbox 1로 세팅했으면 Name Comments textbox height

같아졌을 것이다.

 

                                                                  [그림-3] LinearLayout(Vertically)

Horizontal LinearLayout 은 첫번째 컴포넌트의 첫번째 텍스트 라인을 기준으로 나머지

콤포넌트를 정렬시키는 기능을 가지고 있다.(이러한 기능은 왠만한 4GL 툴에서는 메뉴로 제공하지만..)

이기능을 사용하지 않으려면 layout XML 에서 android:baselineAligned="false" 처럼

세팅하면 된다.

 

 

3.  TableLayout

TableLayout 은 말그대로 row column 을 가지고 있는 테이블을 만든다.

그렇지만 Html 처럼 Border 는 표시되지 않는다. 아래그림에서 도트 표시되어 있는

라인이 실제로는 보여지지 않는다는 이해를 돕기 위해 임의로 표시해놓은 것이다.

(테이블이 View 로 들어가지 않고 Layout 으로 들어간 것이 특이하다)

 

                                                                      [그림-4] TableLayout

 

4.  AbsoluteLayout

이번 레이아웃은 콤포넌트들을 X/Y 위치에 포커싱 하기 위한 레이아웃이다.

Where(0,0) 하면 좌측 상단 꼭지점을 말한다.(일반적으로 JAVA Layout 과 같다고 생각하면 된다.)

주의할점은 Margin 이 지원되지 않으며, 권장할 만한 사항은 아니지만 콤포넌트 끼리 겹쳐서

포지셔닝 되는 것이 가능하다.

또한 AbsoluteLayout 은 정말로 잘 사용할 자신이 없으면 사용하지 않는 것이 좋다.

왜냐하면 디바이스 별로 다르게 동작할 수 있기 때문이다.(그래서 페이지에 딸랑 3줄로

설명이 되어 있었군요..) 

 

5.  RelativeLayout

RelativeLayout 은 각 콤포넌트들 끼리 서로 위치에 대한 정보를 주고 받는 Layout 을 말한다.

기준이 되는 콤포넌트가 우선 하나 정해져야 하며, 나머지 콤포넌트 들은 기준 콤포넌트를

우선으로 해서 자신의 위치를 세팅할수 있다.

 

아래 그림을 보면. 기준이 되는 TextView 컴포넌트가 우선 자리를 잡고 있다.

그아래 EditText below 항목을 보면 “label1” 으로 되어 있다. 이것은 기준 콤포넌트인

TextView ID 가 되겠다. 그러니까 TextView 의 아래에 나 EditBox 가 위치하고 있다는

것을 의미한다.

RelativeLayout 클래스의 Constants 를 살펴보면 POSITION_BELOW , POSITION_ABOVE

등이 있는 것을 확인할 수 있다.

 

[그림-5] RelativeLayout

 

 

 

출처 - http://mnd777.egloos.com/1047906

댓글 없음:

댓글 쓰기