[Android Dev.] Tab 사용하기

Tab 의 구성

Android 의 Tab 은 3가지 요소로 구성되어 있다.

• Tab Host : 전체 Tab 을 구성하는 Tab Widget 와 FrameLayout 을 포함 하는 컨테이너
  
  


• Tab Widget : Tab 버튼을 담고 있는 컨테이너
  
  


• FrameLayout : Tab 버튼에 따라 보여질 내용을 담고 있는 컨테이너
  
  

TabActivity상속 받아 Activity를 구현 할 때(Tab 자체가 Activity의 main 화면일 때) TabHost의 id는 항상 "@android:id/tabhost"로 설정 하여야 한다.



Tab Widget 는 아이콘과 텍스트로 구성이 되는데 ID는 항상 "@android:id/tabs" 이어야 하며 텍스트만으로 구성이 되더라도 최소 높이가 62px 이다.

Tab Widget

FrameLayout 은 TabHost 에 포함되는 컨테이너로 TabHost 내의 좌상단(0,0)에서 그려지게 되는데 TabHost 의 상단에는 Tab Widget가 표현되고 있어 Tab Widget을 가리게 된다. 따라서 가려지는 일을 피하려면 Tab Widget 높이 만큼 FrameLayout 의 padding-top 을 설정해 주어야 한다.

FrameLayout 의 padding-top 이 0px 인 경우

탭 생성하는 절차

• findViewById 로 xml 리소스에서 Tab 가져오기


• setup() 함수 호출


• TabHost.TabSpec 객체를 활용하여 탭을 구성하고 추가하기


• 활성화할 Tab 인데스 지정
  
  

main.xml

<?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"
            android:paddingTop="0px"
        >
            <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>

java source

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.main);
    
    TabHost tabHost = (TabHost)findViewById( R.id.tabHost );
    
    // TabHost 를 findViewById 로 생성한 후 Tab 추가 전에 꼭 실행해 주어야 함.
    tabHost.setup();
    
    // 새로운 Tab 을 생성하기 위한 Tab 객체 생성
    TabHost.TabSpec spec;
    
    // 첫 번째 Tab 설정 및 등록
    spec = tabHost.newTabSpec( "Tab 00" );  // 새 Tab 생성
    spec.setIndicator("Clock");             // Tab 제목
    spec.setContent(R.id.layout);           // Tab 내용
    tabHost.addTab( spec );                 // 생성 된 Tab 등록
    
    // 두 번째 Tab 설정 및 등록        
    spec = tabHost.newTabSpec( "Tab 01" );  // 새 Tab 생성
    spec.setIndicator( "Button", getResources().getDrawable(R.drawable.icon) ); // Tab 제목
    spec.setContent( R.id.btnClickme );     // Tab 내용
    tabHost.addTab( spec );                 // 생성 된 Tab 등록
    
    // 첫 번째 탭을 활성화 
    tabHost.setCurrentTab( 0 );
}

<

Original Post : http://neodreamer-dev.tistory.com/417