动态设置 TabHost选项卡属性及自定义TabHost选项Layout

TabHost生成后会向内添加TabSpec以形成选项栏：

如果是继承的TabActivity类：

tabhost = getTabHost();
tabhost.addTab(tabhost.newTabSpec("1"
).setIndicator(
"TAB 1"
, getResources().getDrawable(R.drawable.icon)).setContent(R.id.text1));
tabhost.setCurrentTab(0
);

tabhost
 = getTabHost();
tabhost.addTab(tabhost.newTabSpec("1").setIndicator("TAB 1", 
getResources().getDrawable(R.drawable.icon)).setContent(R.id.text1)); 
tabhost.setCurrentTab(0);

如果是直接继承Activity类：

tabhost = (TabHost) findViewById(R.id.tabhost);
tabhost.setup();
tabhost.addTab(tabhost.newTabSpec("1"
).setIndicator(
"TAB 1"
, getResources().getDrawable(R.drawable.icon)).setContent(R.id.text1));
tabhost.setCurrentTab(0
);

tabhost
 = (TabHost) findViewById(R.id.tabhost);
tabhost.setup();
tabhost.addTab(tabhost.newTabSpec("1").setIndicator("TAB 1", 
getResources().getDrawable(R.drawable.icon)).setContent(R.id.text1)); 
tabhost.setCurrentTab(0);

注意加.setup()，否则会有NullPointer的异常

main.xml:

<
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
 
android:id
=
"@android:id/tabs"
 
android:layout_width
=
"fill_parent"
 
android:layout_height
=
"fill_parent"
 
/>
        <
FrameLayout
 
android:id
=
"@android:id/tabcontent"
 
android:layout_width
=
"fill_parent"
 
android:layout_height
=
"fill_parent"
>
            <
TextView
 
android:id
=
"@+id/text1"
 
android:layout_width
=
"wrap_content"
 
android:layout_height
=
"wrap_content"
 
/>
        </
FrameLayout
>
    </
LinearLayout
>
</
TabHost
>

<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 android:id="@android:id/tabs" 
android:layout_width="fill_parent" android:layout_height="fill_parent" 
/>
		<FrameLayout android:id="@android:id/tabcontent" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent">
			<TextView android:id="@+id/text1" 
android:layout_width="wrap_content" android:layout_height="wrap_content"
 />
		</FrameLayout>
	</LinearLayout>
</TabHost> 

注意：TabHost标签下的TabWidget和FrameLayout的id 是固定的，分别为"tabs"和"tabcontent"

---------------------------------------------------------------------------------- 分割线 ---------------------------------------------------------------------------------------------

动态更改TabHost的选项卡头显示，有两种方法：一种比较笨而且可控性差（为 什么还要讲一会再说），一种比较简单而且可控性高，我们先说简单的那一种：

TabHost本身不提供有效的函数支持对选项卡头的动态更改，但是我们可以通过 TabHost的getTabWidget()函数得到选项卡头的View从而"曲线"更改选项卡头的属性：

 

ImageView iv = (ImageView) tabhost.getTabWidget().getChildAt(targetLocation).findViewById(android.R.id.icon);
TextView tv = (TextView) tabhost.getTabWidget().getChildAt(targetLocation).findViewById(android.R.id.title);
tv.setText("XXXX"
);
iv.setImageDrawable(getResources().getDrawable(R.drawable.icon));

ImageView
 iv = (ImageView) 
tabhost.getTabWidget().getChildAt(targetLocation).findViewById(android.R.id.icon);
TextView
 tv = (TextView) 
tabhost.getTabWidget().getChildAt(targetLocation).findViewById(android.R.id.title);
tv.setText("XXXX");
iv.setImageDrawable(getResources().getDrawable(R.drawable.icon));
			

其中获得的ImageView即是TabHost的选项卡 头在targetLocation位置的图片的View，TextView是对应的文字的View，这样就可以对它们进行任意的改动了，注意 targetLocation从0开始

还有一种比较笨的方法：

就是自定义TabHost选项卡头的Layout，如下：

 

tabhost = getTabHost();
RelativeLayout tempLayout = (RelativeLayout) LayoutInflater.from(this
).inflate(R.layout.mytab, 
null
);
TextView targetTabLabel = (TextView) tempLayout.findViewById(R.id.tab_text);
targetTabLabel.setText("TAB 1"
);
tempLayout.removeAllViews();
tabhost.addTab(tabhost.newTabSpec("1"
).setIndicator(targetTabLabel).setContent(R.id.text1));

tabhost
 = getTabHost();
RelativeLayout tempLayout = (RelativeLayout) 
LayoutInflater.from(this).inflate(R.layout.mytab, null);
TextView targetTabLabel = (TextView) 
tempLayout.findViewById(R.id.tab_text);
targetTabLabel.setText("TAB 1");
tempLayout.removeAllViews();
tabhost.addTab(tabhost.newTabSpec("1").setIndicator(targetTabLabel).setContent(R.id.text1));

注意要对tempLayout使用removeAllViews()，否则在将 targetTabLabel加入TabHost中时会出现java.lang.IllegalStateException: The specified child already has a parent. You must call removeView() on the child's parent first.的异常

其中R.layout.mytab来自mytab.xml:

<?
xml
 
version
=
"1.0"
 
encoding
=
"utf-8"
?>
<
RelativeLayout
 
xmlns:android
=
"http://schemas.android.com/apk/res/android"
    android:layout_width
=
"wrap_content"
    android:layout_height
=
"wrap_content"
>
<
TextView
 
android:id
=
"@+id/tab_text"
        android:layout_width
=
"wrap_content"
        android:layout_height
=
"wrap_content"
        android:gravity
=
"center"
        android:textStyle
=
"bold"
        android:background
=
"@drawable/selector_img"
/>
</
RelativeLayout
>

<?xml
 version="1.0" encoding="utf-8"?>
<RelativeLayout 
xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
<TextView android:id="@+id/tab_text"  
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textStyle="bold" 
        android:background="@drawable/selector_img"/>
</RelativeLayout>

其中android:text="@drawable/selector_img"指向 selector_img.xml:

 

<?
xml
 
version
=
"1.0"
 
encoding
=
"utf-8"
?>
<
selector
 
xmlns:android
=
"http://schemas.android.com/apk/res/android"
>
<
item
 
android:state_selected
=
"false"
      android:drawable
=
"@drawable/img1"
>
</
item
>
<
item
 
android:state_selected
=
"true"
      android:drawable
=
"@drawable/img2"
>
</
item
>
</
selector
>

<?xml
 version="1.0" encoding="utf-8"?>
<selector 
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="false"
	  android:drawable="@drawable/img1">
</item>
<item android:state_selected="true"
      android:drawable="@drawable/img2">
</item>
</selector>

点击时使用Selector置换背景图片，文字的更改尚未用此方法验证，这种方法非常繁琐而且可控性太差，只能响应选择事件，且只能更改2个选项，但是之 所以讲解这种方法，是因为这里顺便讲解了如何自定义TabHost选项卡头的Layout，如果你想在UI上做出更多的花样，这个技巧是很有帮助的。