【Android入門】Android TabHost的使用(翻譯與Android SDK)

原文位址：

http://developer.android.com/resources/tutorials/views/hello-tabwidget.html

翻譯：

你需要一個TabHost和一個TabWidget來建立一個帶Tab的界面，TabHost必須是Layout的根節點，該Layout檔案還必須包換TabWidget來顯示Tabs和一個FrameLayout來顯示Tab的内容。

Tab内容的實作有兩種，1.使用Tabs在同一個活動Activity種切換視圖Views,或者使用Tabs來切換不同的活動.使用哪種方法完全取決于你自己的需要，不過如果每個Tab提供完全不同的使用者活動,那更優的方法是讓每個Tab都使用獨立的活動，這樣的設計比把所有的東西都寫在一個活動和Layout中更友善管理。

在這個介紹中，我将為每個Tab建立獨立的活動：

1.  建立一個名為"HelloTabWidget"的新項目:

2.  首先，在你的項目中建立三個獨立的活動類,ArtistsActivity,AlbumsActivity和SongsActivity。這些類每個都代表着一個獨立的Tab。現在，使用TextView讓每個活動都顯示一個簡單的資訊，比如：

public class ArtistsActivity extends Activity {

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

TextView textview = new TextView(this);

textview.setText("This is the Artists tab");

setContentView(textview);

}

}

•  注意這裡沒有使用Layout的XML檔案，隻是建立了一個TextView,給它一段Text并把它設定成内容Content. 給三個活動類都做類似的事情。讓後再Android Manifest檔案中加入<activity/> 标簽。
•  你需要為每個Tab設定圖示，你應該為每個圖示建立兩個版本，一個為了當這個圖示被選擇的時候，一個為了未被選擇的時候。當然公認推薦的做法是被選擇的圖示為深色的（灰），未被選擇的圖示為亮色的（白色），比如：

• 

  

  在這個介紹中，你可以複制以上圖檔并在所有三個Tabs中使用它們(當你在你自己的應用中建立Tabs，你應該建立自定義的Tab 圖示)。

  現在建立一個state-list drawable的檔案聲明為每一個Tab狀态State該使用哪張圖檔：

  1. 把圖示檔案導入在res/drawable/目錄裡

  2. 在res/drawable/裡建立一個新的名為ic_tab_artists.xml的檔案輸入代碼如下

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

  <selector

  xmlns:android="http://schemas.android.com/apk/res/android">

  <!-- When selected, use grey -->

  <item android:drawable="@drawable/ic_tab_artists_grey"

  android:state_selected="true"

  />

  <!-- When not selected, use white-->

  <itemandroid:drawable="@drawable/ic_tab_artists_white"

  />

  </selector>

  這是一個state-list drawable,你将把它應用程你TAB的圖像，當TAB的狀态改變，TAB的圖示也會自動在這裡定義的圖像間切換。

  4. 打開res/layout/main.xml然後輸入以下代碼

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

  <TabHost xmlns:android="http://schemas.android.com/apk/res/android"

  android:id="@android: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"

  android:padding="5dp"

  >

  <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:padding="5dp"

  />

  </LinearLayout>

  </TabHost>

  以上建立的Layout是将顯示TABS以及提供各活動間導航的Layout.

  Tabhost對象要求在他内部的某個地方要包含有一個TabWidget和一個FrameLayout.為了将TabWidget和FrameLayout垂直擺放，這裡使用一個線性布局Linear Layout.FrameLayout是顯示每個TAB内容的地方。現在FrameLayout是空的是由于TabHost會自動将活動填充到裡面

  注意，TabWidget和FrameLayout元件的ID是tabs和tabcontent，這裡必須要使用這兩個ID，這樣TabHost才可以取得它們的引用

  5.  現在打開HelloTabWidget.java，使它繼承于TabActivity

  public class HelloTabWidget extends TabActivity {​ 

  6. 将下列代碼作為該類的onCreate()方法

  public void onCreate(Bundle savedInstanceState) {

  super.onCreate(savedInstanceState);

  setContentView(R.layout.main);

  Resources res = getResources(); // Resource object to get Drawables

  TabHost tabHost = getTabHost(); // The activity TabHost

  TabHost.TabSpec spec; // Resusable TabSpec for each tab

  Intent intent; // Reusable Intent for each tab

  // Create an Intent to launch an Activity for the tab (to be reused)

  intent = new Intent().setClass(this, ArtistsActivity.class); // Initialize a TabSpec for each tab and add it to the TabHost

  spec=tabHost.newTabSpec("artists").setIndicator("Artists",res.getDrawable(R.drawable.ic_tab_artists)).setContent(intent);

  tabHost.addTab(spec); // Do the same for the other tabs

  intent = new Intent().setClass(this, AlbumsActivity.class);

  spec = tabHost.newTabSpec("albums").setIndicator("Albums,res.getDrawable(R.drawable.ic_tab_albums)).setContent(intent);

  tabHost.addTab(spec);

  intent = new Intent().setClass(this, SongsActivity.class);

  spec = tabHost.newTabSpec("songs").setIndicator("Songs",res.getDrawable(R.drawable.ic_tab_songs)).setContent(intent);

  tabHost.addTab(spec);

  tabHost.setCurrentTab(2);

  }

  以上代碼設定了每個TAB的标題和圖示，然後給每個配置設定了一個活動

  首先TabHost的引用由getTabHost()函數傳回。然後，為每個TAB，一個TabHost.TabSpec對象被建立用來定義TAB的屬性。方法newTabSpec(String)被用來建立一個新的辨別為輸入的字元串的TabHost.TabSpec對象。為每個Tab,setIndicator(CharSequence,Drawable)方法被調用來定義該TAB得标題和圖示。setContent(Intent)被調用用來指定打開适當活動的Intent。然後每個TabHost.TabSpec通過調用addTab(TabHost.TabSpec)方法被添加到TabHost。

  在最後，setCurrentTab(int)方法定義了預設被選中顯示的Tab，輸入的INT值為被預設選中的TAB的索引位置。

  注意到TabWidget對象沒有被引用過。這是因為一個TabWidget對象一定一直是一個你用來完成幾乎所有和TABS有關互動的TabHost的一個孩子。是以當一個TAB被添加到TabHost的時候，他也會自動被添加到孩子TabWidget裡。

  7.  現在打開Android Manifest檔案，添加NoTitleBar主題到HelloTabWidget的<activity>标簽内，這将會自動去除預設的應用程式頂部的标題，給Tabs提供更多的空間，現在<activity>标簽看起來應該是這樣的：

  <activity android:name=".HelloTabWidget"

  android:label="@string/app_name"

  android:theme="@android:style/Theme.NoTitleBar"

  > 

  8.  運作程式

  你的程式大緻上應該是這樣滴！