2011년 1월 28일 금요일

[Android 강좌][Korean][테마] - Android 기본 Tab 기능




안드로이드에서는 TabHost 컨테이너를 통해 탭 기능을 제공합니다.
화면에 표현하기에 많은 내용이 있다면,
Tab을 사용해 화면을 확장하는 효과를 사용하여 내용을 표현할 수 있습니다.

화면의 일부에 여러 개 탭을 표시하고,
탭을 클릭하면 해당 탭에 속한 화면을 보여주는 구조입니다.
탭을 구성하기 위해서 아래의 항목들을 사용해야 합니다.
(1) TabHost 클래스 : 탭 버튼과 탭 내용을 아우르는 전체 탭 컨테이너
(2) TabWidget 클래스 : 탭 버튼 목록을 관리.
탭 버튼은 텍스트 문자열이 들어가고, 필요한 경우에는 아이콘을 설정
(3) FrameLayout 컨테이너 : 탭 내용을 관리. 각 탭 내용은 FrameLayout 내부에 하나의 위젯



※ Example Code
- TapView_Default.java
public class TapView_Default extends TabActivity {

    private TabHost m_tabHost = null;
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);     
        setContentView(R.layout.tapview_default_layout);
       
        /** TabHost ID */
        m_tabHost= (TabHost)findViewById(android.R.id.tabhost); 
        TabSpec aaa_TabSpec = m_tabHost.newTabSpec("aaa"); 
        TabSpec bbb_TabSpec = m_tabHost.newTabSpec("bbb");
        TabSpec ccc_TabSpec = m_tabHost.newTabSpec("ccc");
        aaa_TabSpec.setIndicator("aaa", getResources().getDrawable(R.drawable.games)); 
        aaa_TabSpec.setContent(new Intent(this,test_activity.class)); 
        bbb_TabSpec.setIndicator("bbb", getResources().getDrawable(R.drawable.games)); 
        bbb_TabSpec.setContent(new Intent(this,test_activity.class)); 
        ccc_TabSpec.setIndicator("ccc", getResources().getDrawable(R.drawable.games)); 
        ccc_TabSpec.setContent(new Intent(this,test_activity.class)); 

        /** 탭을 TabHost 에 추가한다 */
        m_tabHost.addTab(aaa_TabSpec);
        m_tabHost.addTab(bbb_TabSpec);
        m_tabHost.addTab(ccc_TabSpec);

        /** TabHost 에 포함된 Tab의 색깔 변경가능 */
        m_tabHost.getTabWidget().getChildAt(0).setBackgroundColor(Color.parseColor("#534512")); 
        m_tabHost.getTabWidget().getChildAt(1).setBackgroundColor(Color.parseColor("#4E4E9C"));
        m_tabHost.getTabWidget().getChildAt(2).setBackgroundColor(Color.parseColor("#6E8E1C"));
        m_tabHost.getTabWidget().setCurrentTab(0); 
    }
}

- tapview_default_layout.xml
<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_height="fill_parent"
    android:layout_width="fill_parent"
    android:orientation="vertical">
        
 <TabHost
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:id="@android:id/tabhost">
  <LinearLayout
    android:id="@+id/LinearLayout01"
   android:orientation="vertical"
   android:layout_height="fill_parent"
   android:layout_width="fill_parent"> 
    <TabWidget
    android:id="@android:id/tabs"
    android:layout_height="wrap_content"
    android:layout_width="fill_parent" >
   </TabWidget>
 
   <FrameLayout
    android:id="@android:id/tabcontent"
    android:layout_height="fill_parent"
    android:layout_width="fill_parent"
    android:layout_weight="1">
   </FrameLayout> 
  </LinearLayout>
 </TabHost>

</LinearLayout>


추가로 문의 사항이나, 궁금한 점이 계시면 연락주세요.
(joonryang@gmail.com)
※ 도움이 되셨다면, ^^. 맨 위 광고클릭 좀..ㅎㅎ

댓글 없음:

댓글 쓰기