레이아웃 기법 - 재사용 가능한 UI 컨포넌트

안드로이드 플랫폼은 다양한 UI 위젯(복잡한 사용자 인터페이스를 표현하기 위해 결합될수 있는 비쥬얼한 컴포넌트)을 제공한다. 그러나 어플리케이션은 가끔 고수준의 비쥬얼 컴포넌트를 필요로 한다. 이런 요구사항을 만족 시키고 매우 효율적으로 수행하기 위해 여러개의 표준 위젯을 하나의 재사용가능한 컴포넌트로 결합할 수 있다.

예를 들어 Progress bar와 취소 버튼 , 확인/취소 두개의 버턴을 가지는 panel, icon, 제목, 설명을 가지는 panel 등을 포함하는 재사용 가능한 컴포넌트를 작성할수 있다. 커스텀 View를 작성함으로서 UI컴포넌트를 작성할수 있으나 XML만을 사용하여 좀더 쉽게 같은 작업할 수 있다.

안드로이드 XML레이아웃 파일에 각 태그는 실제 클래스 인스턴스(이 클래스는 항상 View 의 서브 클래스이다.)로 매핑 된다. UI toolkit은 View 인스턴스에 매핑되지 않는 3개의 특별한 태그(<requestFocus /> <merge /> <include />를 제공한다. 본 글에서 순수한 XML 비쥬얼 컴포넌트를 작성하기 위해 <include />를 어떡해 사용하는지를 보여줄 것이다. <include />와 조합되었을때 특히 강력한 기능을 보여주는 <merge />의 사용법은 레이아웃 합치기 을 참고 하기 바란다.

<include /> element는 이름이 뜻하는 데로 다른 XML 레이아웃을 포함하는 동작을 수행한다. 이 태그의 사용법은 아래의 예제에서 처럼 간단하며 안드로이드와 함께 출시되는 홈 어플리케이션의 소스 코드를 얻을 수 있다.

<com.android.launcher.Workspace

    android:id="@+id/workspace"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"


    launcher:defaultScreen="1">


    <include android:id="@+id/cell1" layout="@layout/workspace_screen" />

    <include android:id="@+id/cell2" layout="@layout/workspace_screen" />

    <include android:id="@+id/cell3" layout="@layout/workspace_screen" />


</com.android.launcher.Workspace>

<include />에서 단지 layout 속성만이 필요하다. 안드로이드 네임스페이스 prefix가 없는 이 속성은 include 하기 원하는 layout 파일을 참조 한다. 이 예제에서 같은 레이아웃이 각 행에서 3번 포함되며 이 태그는 포함된 레이아웃의 많은 속성을 재정의할수 있도록 해준다. 위 예제에서 포함된 레이아웃 최상위 뷰의 id를 명시하기 위해 android:id를 사용할수 있다는 것을 보여준다. 하나가 정의되어 있다면 포함된 레이아웃의 id를 재정의할수 있을 것이다. 비슷한 방법으로 모든 레이아웃 파라미터를 재정의 할 수 있다. 이 말은 android:layout_*의 속성이 <include /> 태그와 함께 사용될수 있다는 것을 뜻한다. 아래의 예를 보자.

 
<include android:layout_width="fill_parent" layout="@layout/image_holder" />

<include android:layout_width="256dip" layout="@layout/image_holder" />
 
 

이 태그는 디바이스의 구성에 의존적인 UI의 일부만을 커스터마이징해야할 경우 특히 유용하다. 예를 들어 activity의 메인 레이아웃은 layout/ 디렉토리에 위치할 수 있고 layout-land/와 layout-port에 존재하는 다른 레이아웃을 포함할 수 있다. 이는 디바이스의 가로 모드와 세로 모드에서 UI의 대부분을 공유할수 있도록 해준다.