TabHost布局文件
我們先來了解一下布局文件的基本內(nèi)容：
1. 根標(biāo)簽及id
設(shè)置Android自帶id : XML布局文件中, 可以使用 標(biāo)簽設(shè)置, 其中的id 需要引用 android的自帶id :
android:id=@android:id/tabhost ;
getHost()獲取前提 : 設(shè)置了該id之后, 在Activity界面可以使用 getHost(), 獲取這個(gè)TabHost 視圖對象;
示例 :
<tabhost android:id="@android:id/tabhost" android:layout_height="match_parent" android:layout_width="match_parent"></tabhost>
2. TabWidget組件
選項(xiàng)卡切換 : 該組件是選項(xiàng)卡切換按鈕, 通過點(diǎn)擊該組件可以切換選項(xiàng)卡;
設(shè)置android自帶id : 這個(gè)組件的id要設(shè)置成android的自帶id : android:id=@android:id/tabs ;
TabHost必備組件 : 該組件與FrameLayout組件是TabHost組件中必備的兩個(gè)組件;
切換按鈕下方顯示 : 如果想要將按鈕放到下面, 可以將該組件定義在下面, 但是注意,FrameLayout要設(shè)置android:layout_widget = 1;
設(shè)置TabWidget大小 : 如果想要設(shè)置該按鈕組件的大小, 可以設(shè)置該組件與FrameLayout組件的權(quán)重;
示例 :
<tabwidget android:id="@android:id/tabs" android:layout_height="wrap_content" android:layout_width="fill_parent" android:orientation="horizontal/"></tabwidget>
3. FrameLayout組件
組件作用 : 該組件中定義的子組件是TabHost中每個(gè)頁面顯示的選項(xiàng)卡, 可以將TabHost選項(xiàng)卡顯示的視圖定義在其中;
設(shè)置android自帶id : 這個(gè)組件的id要設(shè)置成android的自帶的id : android:id=@android:id/tabcontent ;
示例 :
<framelayout android:id="@android:id/tabcontent" android:layout_height="fill_parent" android:layout_weight="1" android:layout_width="fill_parent"></framelayout>
示例
上圖為最終效果圖
代碼結(jié)構(gòu)圖
main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/hometabs" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- TabHost必須包含一個(gè) TabWidget和一個(gè)FrameLayout--> <TabHost android:id="@+id/tabhost" android:layout_width="fill_parent" android:layout_height="wrap_content" > <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- TabWidget的id屬性必須為 @android:id/tabs--> <TabWidget android:id="@android:id/tabs" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content"> </TabWidget> <!-- FrameLayout的id屬性必須為 @android:id/tabcontent--> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:id="@+id/view1" android:layout_width="fill_parent" android:layout_height="fill_parent"/> <TextView android:id="@+id/view2" android:layout_width="fill_parent" android:layout_height="fill_parent"/> <TextView android:id="@+id/view3" android:layout_width="fill_parent" android:layout_height="fill_parent"/> </FrameLayout> </LinearLayout> </TabHost> </LinearLayout>
java代碼如下
package cn.com.tagHost.test; import android.app.Activity; import android.os.Bundle; import android.widget.TabHost; import android.widget.TabWidget; public class TagHostTest2 extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); // 獲取TabHost對象 TabHost tabHost = (TabHost) findViewById(R.id.tabhost); // 如果沒有繼承TabActivity時(shí)，通過該種方法加載啟動(dòng)tabHost tabHost.setup(); tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("第一個(gè)標(biāo)簽", getResources().getDrawable(R.drawable.icon)).setContent( R.id.view1)); tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("第三個(gè)標(biāo)簽") .setContent(R.id.view3)); tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("第二個(gè)標(biāo)簽") .setContent(R.id.view2)); } } 運(yùn)行得到正確的結(jié)果。
廢話連篇：這里需要注意的是
第一：布局文件的格式。以及TabWidget和FrameLayout的id屬性值。
第二：TabWidget代表的是標(biāo)簽部分，F(xiàn)rameLayout代表的點(diǎn)擊標(biāo)簽后看到的內(nèi)容部分。FrameLayout里面聲明的組件意為具備成為標(biāo)簽內(nèi)容的資格，具體的還要在代碼中具體指定。
你是否也想要這種結(jié)果呢。讓標(biāo)簽在下部分顯示
那么你只需要給main.xml進(jìn)行下布局修改就可以了。
main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/hometabs" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- TabHost必須包含一個(gè) TabWidget和一個(gè)FrameLayout--> <TabHost android:id="@+id/tabhost" android:layout_width="fill_parent" android:layout_height="wrap_content"> <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- FrameLayout的id屬性必須為 @android:id/tabcontent--> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:id="@+id/view1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="hello baby!" /> <TextView android:id="@+id/view2" android:layout_width="fill_parent" android:layout_height="fill_parent" /> <TextView android:id="@+id/view3" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </FrameLayout> <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- TabWidget的id屬性必須為 @android:id/tabs--> <TabWidget android:id="@android:id/tabs" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:paddingBottom="0dp" > </TabWidget> </RelativeLayout> </LinearLayout> </TabHost> </LinearLayout>
為了讓標(biāo)簽和父容器底部持平，我們使用了android:layout_alignParentBottom="true"，該屬性只有在RelativeLayout布局中才會(huì)存在哦、這也是為什么我們將tabWidget放入一個(gè)RelativeLayout中的原因。
此外，在lineaerLayout布局中，TabWidget和FrameLayout的位置可是調(diào)換了哦。
新聞熱點(diǎn)
疑難解答
圖片精選
