Android Tab 탭 사용 기초

Android 프로그램 에서 Tab 탭 창 은 자주 사용 하 는 UI 인터페이스 요소 입 니 다.그것 의 실현 은 주로 TabHost 류 를 이용 한 것 이다.
TabHost 설명
TabHost 는 탭 창의 용기 입 니 다.
하나의 TabHost 대상 은 두 개의 하위 요소 대상 을 포함 합 니 다:
하나의 대상 은 tab 태그 집합(TabWidget)입 니 다.사용 자 는 이 를 클릭 하여 특정한 탭 을 선택 합 니 다.
또 하 나 는 FrameLayout 대상 으로 현재 페이지 의 내용 을 보 여 줍 니 다. 
하위 요 소 는 하위 요소 의 값 을 직접 설정 하 는 것 이 아니 라 용기 대상 을 통 해 제어 합 니 다.
다음은 ApiDemos 의 예 를 결합 하여 TabHost 의 용법 을 설명 한다. 
첫 번 째 Tab 예:TabActivity 사용 하기
이 예 는 TabActivity 를 사 용 했 습 니 다.
Java 프로그램 코드:

package com.meng.hellotab;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.widget.TabHost;
import android.app.TabActivity;

@SuppressWarnings("deprecation")
public class HelloTabActivity extends TabActivity
{

  @Override
  protected void onCreate(Bundle savedInstanceState)
  {
    super.onCreate(savedInstanceState);

    //   TabActivity  TabHost  
    TabHost tabHost = getTabHost();

    //   ：          
    LayoutInflater.from(this).inflate(R.layout.activity_hello_tab,
        tabHost.getTabContentView(), true);

    //     
    //     ：   TabSpec   ，        
    // setContent       View    
    tabHost.addTab(tabHost.newTabSpec("tab1")
        .setIndicator("tab1 indicator").setContent(R.id.view1));
    tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab2")
        .setContent(R.id.view2));
    tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab3")
        .setContent(R.id.view3));
  }

}

레이아웃 파일 은 다음 과 같 습 니 다.
레이아웃 파일 1

    1

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent" >

  <TextView
    android:id="@+id/view1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/blue"
    android:text="@string/tab1" />

  <TextView
    android:id="@+id/view2"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/red"

    android:text="@string/tab2" />

  <TextView
    android:id="@+id/view3"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/green"
    android:text="@string/tab3" />

</FrameLayout>

레이아웃 파일 의 색상 문자열 은 다음 과 같 습 니 다:텍스트 문자열 약.

colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

  <drawable name="red">#7f00</drawable>
  <drawable name="blue">#770000ff</drawable>
  <drawable name="green">#7700ff00</drawable>
  <drawable name="yellow">#77ffff00</drawable>
  <drawable name="screen_background_black">#ff000000</drawable>
  <drawable name="translucent_background">#e0000000</drawable>
  <drawable name="transparent_background">#00000000</drawable>

  <color name="solid_red">#f00</color>
  <color name="solid_blue">#0000ff</color>
  <color name="solid_green">#f0f0</color>
  <color name="solid_yellow">#ffffff00</color>

</resources>

캡 처 실행:



TabActivity 라 는 클래스 는 다음 과 같이 표시 되 어 있 습 니 다:This class was deprecated in API level 13.
두 번 째 프로그램:TabHost.TabContentFactory 사용 하기
TabHost.TabContentFactory 이 인 터 페 이 스 는 tab 이 선택 되 었 을 때 자신 이 콘 텐 츠 를 만 드 는 데 사 용 됩 니 다.이미 존재 하 는 view 를 표시 하거나 activity 를 시작 하 는 것 이 아니 라 다른 방법 을 사용 해 야 합 니 다.
구체 적 인 실현 은 코드 참조:

package com.meng.hellotab;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.TabHost;
import android.widget.TextView;
import android.app.TabActivity;

@SuppressWarnings("deprecation")
public class HelloTabActivity extends TabActivity implements
    TabHost.TabContentFactory
{

  @Override
  protected void onCreate(Bundle savedInstanceState)
  {
    super.onCreate(savedInstanceState);

    TabHost tabHost = getTabHost();

    //           ，           content   
    // LayoutInflater.from(this).inflate(R.layout.activity_hello_tab,
    // tabHost.getTabContentView(), true);

    // setContent   this
    tabHost.addTab(tabHost.newTabSpec("tab1")
        .setIndicator("tab1 indicator").setContent(this));
    tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab2")
        .setContent(this));
    tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab3")
        .setContent(this));
  }

  // setContent     this ，          Tab   （        ，      ）
  @Override
  public View createTabContent(String tag)
  {
    //   ：             tag   

    final TextView tv = new TextView(this);
    tv.setText("Content for tab with tag " + tag);
    return tv;
  }

}

프로그램 실행 캡 처:

또한 Tab 의 콘 텐 츠 내용 은 또 다른 Activity 를 시작 할 수 있 으 며,setContent 방법 에 하나의 Intent 를 입력 하면 된다.
이 부분 은 더 이상 소개 하지 않 습 니 다.ApiDemos 의 Tabs 3.java 코드 를 참조 할 수 있 습 니 다. 
세 번 째 프로그램:TabActivity 계승 안 함
앞의 두 프로그램의 예 는 모두 TabActivity 클래스 를 계승 한 것 입 니 다.계승 하지 않 으 면 TabHost 의 레이아웃 을 직접 써 야 합 니 다.그 중에서 필요 한 두 가지 하위 요 소 를 포함 합 니 다.TabWidget 과 FrameLayout 는 모두 고정 값 입 니 다.코드 를 보십시오.
레이아웃 파일 코드:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical" >

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/hello_world" />

  <!-- TabHost       TabWidget   FrameLayout -->

  <TabHost
    android:id="@+id/myTabHost"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:orientation="vertical" >

      <!-- TabWidget id      @android:id/tabs -->

      <TabWidget
        android:id="@android:id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0"
        android:orientation="horizontal" />

      <!-- FrameLayout id      @android:id/tabcontent -->

      <FrameLayout
        android:id="@android:id/tabcontent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="0" >

        <TextView
          android:id="@+id/view1"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:text="Tab1 Content" />

        <TextView
          android:id="@+id/view2"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:text="Tab2 Content" />

        <TextView
          android:id="@+id/view3"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:text="Tab3 Content" />
      </FrameLayout>
    </LinearLayout>
  </TabHost>

</LinearLayout>

Activity 코드:

package com.meng.hellotabhost;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.TabHost;

public class HelloTabHostActivity extends Activity
{

  @Override
  protected void onCreate(Bundle savedInstanceState)
  {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_hello_tab_host);

    TabHost tabHost = (TabHost) findViewById(R.id.myTabHost);

    //       TabActivity，      tabHost  ，        tabHost.setup()
    tabHost.setup();

    //   content            view
    tabHost.addTab(tabHost.newTabSpec("tab1")
        .setIndicator("tab1 indicator").setContent(R.id.view1));
    tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab2")
        .setContent(R.id.view2));
    tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab3")
        .setContent(R.id.view3));
  }

}

이런 방식 은 비교적 유연 한 구 조 를 실현 할 수 있 고 다른 구성 요 소 를 편리 하 게 가입 할 수 있 으 며 탭 표시 줄 과 내용 표시 줄 의 상대 적 인 위 치 를 바 꿀 수 있다.
네 번 째 프로그램:scrolling Tab
탭 이 너무 많 을 때 스크롤 뷰 에 탭 을 설정 해 야 합 니 다.위의 절차 가 기초 가 되 었 으 니 이것 은 이해 하기 쉽다.
ApiDemos 에서 제시 한 것 은 여전히 TabActivity 를 계승 하 는 방법 이다.여기 서 TabActivity 를 계승 하지 않 아 도 되 는 다른 방법 을 제시 하 는데 두 가지 방법 은 매우 유사 하 다.
레이아웃 파일:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical" >

  <TabHost
    android:id="@+id/myTabHost"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical"
      android:padding="5dp" >

      <HorizontalScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scrollbars="none" >

        <TabWidget

          android:id="@android:id/tabs"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content" />
      </HorizontalScrollView>

      <FrameLayout
        android:id="@android:id/tabcontent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="5dp" />
    </LinearLayout>
  </TabHost>

</LinearLayout>

Java 코드:

package com.meng.hellotabscroll;

import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.widget.TabHost;
import android.widget.TextView;

public class HelloTabScrollActivity extends Activity implements
    TabHost.TabContentFactory
{

  @Override
  protected void onCreate(Bundle savedInstanceState)
  {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_hello_tab_scroll);

    //       TabHost   
    TabHost tabHost = (TabHost) findViewById(R.id.myTabHost);
    tabHost.setup();

    //   30   
    for (int i = 1; i <= 30; i++)
    {
      String name = "Tab " + i;
      tabHost.addTab(tabHost.newTabSpec(name).setIndicator(name)
          .setContent(this));
    }

  }

  @Override
  public View createTabContent(String tag)
  {
    final TextView tv = new TextView(this);
    tv.setText("Content for tab with tag " + tag);
    return tv;
  }

}

이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.