本文結合源代碼和實例來講明TabHost的用法。
使用TabHost 能夠在一個屏幕間進行不一樣版面的切換,例如android自帶的撥號應用,截圖:
查看tabhost的源代碼,主要實例變量有:
java
private TabWidget mTabWidget;
private FrameLayout mTabContent;
private List<TabSpec> mTabSpecs
也就是說咱們的tabhost必須有這三個東西,因此咱們的.xml文件就會有規定:繼續查看源代碼:
android
if (mTabWidget ==
null) {
throw
new RuntimeException(
"Your TabHost must have a TabWidget whose id attribute is 'android.R.id.tabs'");
}
mTabContent = (FrameLayout) findViewById(com.android.internal.R.id.tabcontent);
if (mTabContent ==
null) {
throw
new RuntimeException(
"Your TabHost must have a FrameLayout whose id attribute is 'android.R.id.tabcontent'");
}
也就是說咱們的.xml文件須要TabWidget和FrameLayout標籤。
接下來構建咱們本身的tab實例:
有兩種方式能夠實現:
一種是繼承TabActivity 類,可使用android的本身內部定義好的.xml資源文件做容器文件。也就是在咱們的代碼中使用getTabHost(); , 而相應的後臺源碼是這樣的:app
this.setContentView(com.android.internal.R.layout.tab_content);
在系統的資源文件中能夠看見這個layout佈局
有了容器,而後咱們就須要咱們爲每一個tab分配內容,固然要能夠是如何類型的標籤:
例如咱們構建一下.xml文件
首先tab1.xml 是一個LinearLayout佈局this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/LinearLayout01" android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView android:text="tab1 with linear layout"
android:id="@+id/TextView01" android:layout_width="wrap_content"
android:layout_height="wrap_content">
</TextView>
</LinearLayout>
而後是tab2.xml是一個FrameLayout佈局spa
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/FrameLayout02"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout android:id="@+id/LinearLayout02"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView android:text="tab2"
android:id="@+id/TextView01" android:layout_width="wrap_content"
android:layout_height="wrap_content">
</TextView>
</LinearLayout>
</FrameLayout>
接着要註冊這兩個FrameLayout爲tabhost的Content,也就是接下來的代碼:
xml
LayoutInflater inflater_tab1 = LayoutInflater.from(
this);
inflater_tab1.inflate(R.layout.tab1, mTabHost.getTabContentView());
inflater_tab1.inflate(R.layout.tab2, mTabHost.getTabContentView());
而後須要構建前面說的tabhost的第三個實例變量對應得內容,源代碼中是這樣的:blog
private List<TabSpec> mTabSpecs =
new ArrayList<TabSpec>(2);
初始化是兩個tab的空間而後會自動擴展:
好 咱們構建咱們的tabspec:
繼承
mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB 11").setContent(R.id.LinearLayout01));
mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB 11").setContent(R.id.FrameLayout02));
也就是把咱們的2個layout做爲他的content,固然FrameLayout中能夠有其餘的佈局,來放個人組件。
咱們不須要在代碼裏面設置setContentView();由於getTabHost(); 這個方法調用後就已經設置了,源代碼:
utf-8
if (mTabHost ==
null) {
this.setContentView(com.android.internal.R.layout.tab_content);
}
也就是把系統的tab_content當作view設置。
運行後以下:
完整代碼:
TabHost mTabHost = getTabHost();
LayoutInflater inflater_tab1 = LayoutInflater.from(
this);
inflater_tab1.inflate(R.layout.tab1, mTabHost.getTabContentView());
inflater_tab1.inflate(R.layout.tab2, mTabHost.getTabContentView());
mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB 11").setContent(R.id.LinearLayout01));
mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB 11").setContent(R.id.FrameLayout02));
還有一種就是定義咱們本身的tabhost:不用繼承TabActivity
首先創建咱們本身的.xml文件,固然要包含Tabhost,TabWidget,FrameLayout,着3個標籤:
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
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">
</FrameLayout>
</LinearLayout>
</TabHost>
注意的是:除了tabhost的id能夠自定義外,其餘的必須使用系統的id,爲何後面說,
固然咱們能夠在FrameLayout裏面添加view來做爲tab的內容只須要在create tabspce時候添加就能夠了,咱們爲了把每一個tab的內容分開咱們依然使用前面用到的兩個tab xml文件
java代碼:
獲取TabHost 經過findviewbyid,
setContentView(R.layout.main);
TabHost mTabHost = (TabHost)findViewById(R.id.tabhost);
接下來很重要的一步是要使用TabHost.setup();
做用是來初始化咱們的TabHost容器:
源代碼是這樣說的:
<p>Call setup() before adding tabs
if loading TabHost using findViewById(). <i><b>However</i></b>: You
do
* not need to call setup() after getTabHost() in {@link android.app.TabActivity TabActivity}.
也就是說經過findviewbyid,方法得到tabhost必須setup 而經過getTabHost則不用。
setup幹什麼呢:源代碼
mTabWidget = (TabWidget) findViewById(com.android.internal.R.id.tabs);
if (mTabWidget ==
null) {
throw
new RuntimeException(
"Your TabHost must have a TabWidget whose id attribute is 'android.R.id.tabs'");
}
mTabContent = (FrameLayout) findViewById(com.android.internal.R.id.tabcontent);
if (mTabContent ==
null) {
throw
new RuntimeException(
"Your TabHost must have a FrameLayout whose id attribute is 'android.R.id.tabcontent'");
}
他主要是初始化了tabhost的兩個實例變量,這裏也回答了爲何咱們的id必須使用系統定義的id的緣由
接下來工做就和前面相同了:
LayoutInflater inflater_tab1 = LayoutInflater.from(
this);
inflater_tab1.inflate(R.layout.tab1, mTabHost.getTabContentView());
inflater_tab1.inflate(R.layout.tab2, mTabHost.getTabContentView());
mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB a").setContent(R.id.LinearLayout01));
mTabHost.addTab(mTabHost.newTabSpec("tab_test2").setIndicator("TAB b").setContent(R.id.FrameLayout02));
完整代碼:
setContentView(R.layout.main);
TabHost mTabHost = (TabHost)findViewById(R.id.tabhost);
mTabHost.setup();
LayoutInflater inflater_tab1 = LayoutInflater.from(
this); inflater_tab1.inflate(R.layout.tab1, mTabHost.getTabContentView()); inflater_tab1.inflate(R.layout.tab2, mTabHost.getTabContentView()); mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB a").setContent(R.id.LinearLayout01)); mTabHost.addTab(mTabHost.newTabSpec("tab_test2").setIndicator("TAB b").setContent(R.id.FrameLayout02));