[Android Dev.] Tab 사용하기 - TabWidget 과 FrameLayout 구성

TabHost 에 포함되는 TabWidget 와 FrameLayout 은 TabHost 컨테이너에 포함되는 구성 요소이지만 그려지는 원점이 서로 같아서 항상 TabWidget 의 높이를 FrameLayout의 paddingTop 으로 설정을 해 주야 한다.

FrameLayout 의 paddingTop 이 설정되지 않은 경우

하지만 이러한 과정은 항상 TabWidget 의 높이를 확인해서 FrameLayout 의 paddingTop을 설정해 주어야 하기에 불편함이 있다. 이를 쉽게 해소하기 위해서는 TabHost 안에 구성되는 TabWidget 와 FrameLayout 을 LinearLayout 컨테이너에 포함시켜 구성하면 쉽게 해결할 수 있다.

LinearLayout 컨테이너에 TabWidget 과 FrameLayout 을 담은 경우

TabWidget 와 FrameLayout을 padding 으로 구성하는 경우
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TabHost android:id="@+id/tabHost" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:id="@+id/layout" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <AnalogClock android:id="@+id/clockAnalog" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" /> <DigitalClock android:id="@+id/clockDigital" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" /> </LinearLayout> <Button android:id="@+id/btnClickme" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="The Button.\nClick me!" /> </FrameLayout> </TabHost> </LinearLayout>

TabWidget 와 FrameLayout을 으로 LinearLayout 으로 구성하는 경우
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TabHost android:id="@+id/tabHost" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="fill_parent" > <LinearLayout android:id="@+id/layout" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent" > <AnalogClock android:id="@+id/clockAnalog" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" /> <DigitalClock android:id="@+id/clockDigital" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" /> </LinearLayout> <Button android:id="@+id/btnClickme" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="The Button.\nClick me!" /> </FrameLayout> </LinearLayout> </TabHost> </LinearLayout>