TabHost两种实现方式及各个方法的作用

android开发tabhost的两种方式

找了好多资料，最后总结一下，以后用到的话可以查阅

TabHost ，它是一个用来存放多个Tab标签的容器。其方法setup主要完成的功能便是实例化TabHost的TabWidget和TabContent。

各个方法的作用：

要用到tab组件，布局layout中必须有TabHost文件，它有一个id，比如 android:id="@+id/tabhost" 或者android:id="@android:id/tabhost"

在TabHost中一般必须有TabWidget，这个主要是用来处理tab的位置、属性等。一般还有FrameLayout组件，用于定义显示的在Tab下显示的组件。

例如：

TabHost tabs = (TabHost) findViewById(R.id.tabhost);

tabs.setup();

TabHost.TabSpec spec = tabs.newTabSpec("tag1");

spec.setContent(R.id.tab1);

spec.setIndicator("Clock");

tabs.addTab(spec);

其中tabs.newTabSpec("tag1")用来new一个tab，同时标记这个tab的tag

setContent()用来处理点击这个tab后的动作，可以是这个Activity下的一个组件，如setContent(R.id.tab1)，也可以是一个intent，比如：setContent(new Intent(this, SubTab.class))

setIndicator()用来标记这个tab的名字，可以是setIndicator("Clock")，也可以包含其他的属性，如图片：setIndicator( "商场",getResources().getDrawable(android.R.drawable.arrow_down_float))

tabs.addTab(spec)将这个tab添加如TabHost

例子一枚：

package com.my.tabwidget;

import java.util.ArrayList;
import java.util.List;

import android.app.TabActivity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TabHost;
import android.widget.TabHost.OnTabChangeListener;
import android.widget.TextView;

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

//声明TabHost对象
TabHost mTabHost;
public List<ImageView> imageList = new ArrayList<ImageView>();
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

//取得TabHost对象
mTabHost = getTabHost();

/* 为TabHost添加标签 */
//新建一个newTabSpec(newTabSpec)
//设置其标签和图标(setIndicator)
//设置内容(setContent)

mTabHost.addTab(mTabHost.newTabSpec("tab_test1")
.setIndicator(composeLayout("TAB_1", R.drawable.img1))
.setContent(R.id.textview1));
mTabHost.addTab(mTabHost.newTabSpec("tab_test2")
.setIndicator(composeLayout("TAB_2", R.drawable.img2))
.setContent(R.id.textview2));
mTabHost.addTab(mTabHost.newTabSpec("tab_test3")
.setIndicator(composeLayout("TAB_3", R.drawable.img3))
.setContent(R.id.textview3));

//设置TabHost的背景颜色
//mTabHost.setBackgroundColor(Color.argb(150, 22, 70, 150));
//设置TabHost的背景图片资源
//mTabHost.setBackgroundResource(R.drawable.image1);

//设置当前显示哪一个标签
mTabHost.setCurrentTab(0);
imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img01));

//标签切换事件处理，setOnTabChangedListener
mTabHost.setOnTabChangedListener(new OnTabChangeListener()
{
// TODO Auto-generated method stub
@Override
public void onTabChanged(String tabId)
{
// 设置所有选项卡的图片为未选中图片
imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img1));
imageList.get(1).setImageDrawable(getResources().getDrawable(R.drawable.img2));
imageList.get(2).setImageDrawable(getResources().getDrawable(R.drawable.img3));

if (tabId.equalsIgnoreCase("tab_test1")) {
imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img01));
// 移动底部背景图片
//moveTopSelect(0);
} else if (tabId.equalsIgnoreCase("tab_test2")) {
imageList.get(1).setImageDrawable(getResources().getDrawable(R.drawable.img02));
// 移动底部背景图片
//moveTopSelect(1);
} else if (tabId.equalsIgnoreCase("tab_test3")) {
imageList.get(2).setImageDrawable(getResources().getDrawable(R.drawable.img03));
// 移动底部背景图片
//moveTopSelect(2);
}

}
});
}
/**
* 这个设置Tab标签本身的布局，需要TextView和ImageView不能重合 s:是文本显示的内容 i:是ImageView的图片位置
*/
public View composeLayout(String s, int i) {
// 定义一个LinearLayout布局
LinearLayout layout = new LinearLayout(this);
// 设置布局垂直显示
layout.setOrientation(LinearLayout.VERTICAL);
ImageView iv = new ImageView(this);
imageList.add(iv);
iv.setImageResource(i);
//设置图片布局
LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, 50);
lp.setMargins(0, 0, 0, 0);
layout.addView(iv, lp);
// 定义TextView

TextView tv = new TextView(this);
tv.setGravity(Gravity.CENTER);
tv.setSingleLine(true);
tv.setText(s);
tv.setTextColor(Color.BLACK);
tv.setTextSize(10);
//设置Text布局
layout.addView(tv, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT));
return layout;
}
}

第一种：

不用继承TabActivity，在布局文件中定义TabHost即可，但是TabWidget的id必须是

@android:id/tabs，FrameLayout的id必须是@android:id/tabcontent。TabHost的id可以自定义.

xml布局：

Java代码

<?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 android:id="@+id/tabhost"
android:layout_width="wrap_content"
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:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</TabWidget>

<FrameLayout android:id="@android:id/tabcontent"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<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代码：
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.hometabs);

TabHost tabHost = (TabHost) findViewById(R.id.tabhost);
tabHost.setup();
TabWidget tabWidget = tabHost.getTabWidget();

tabHost.addTab(tabHost.newTabSpec("tab1")
.setIndicator("tab1", getResources().getDrawable(R.drawable.mumule))
.setContent(R.id.view1));

tabHost.addTab(tabHost.newTabSpec("tab3")
.setIndicator("tab3")
.setContent(R.id.view3));

tabHost.addTab(tabHost.newTabSpec("tab2")
.setIndicator("tab2")
.setContent(R.id.view2));

final int tabs = tabWidget.getChildCount();
Log.i(TAG, "***tabWidget.getChildCount() : " + tabs);

final int tabWidth = 90;
final int tabHeight = 45;

for (int i = 0; i < tabs; i++) {
/* final View view = tabWidget.getChildAt(i);
view.getLayoutParams().width = tabWidth;
view.getLayoutParams().height = tabHeight;
final TextView tv = (TextView) view.findViewById(android.R.id.title);
tv.setTextColor(this.getResources().getColorStateList(android.R.color.black));
MarginLayoutParams tvMLP = (MarginLayoutParams)tv.getLayoutParams();
tvMLP.bottomMargin = 8;*/
}
}

第二种：

第一种：继承TabActivity，从TabActivity中用getTabHost()方法获取TabHost。只要定义具体Tab内容布局就行了.

xml布局：

Java代码

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<LinearLayout android:id="@+id/widget_layout_Blue"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical" >
<EditText android:id="@+id/widget34" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:text="EditText"
android:textSize="18sp">
</EditText>
<Button android:id="@+id/widget30" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Button">
</Button>
</LinearLayout>
<LinearLayout android:id="@+id/widget_layout_red"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical" >
<AnalogClock android:id="@+id/widget36"
android:layout_width="wrap_content" android:layout_height="wrap_content">
</AnalogClock>
</LinearLayout>
<LinearLayout android:id="@+id/widget_layout_green"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:orientation="vertical">
<RadioGroup android:id="@+id/widget43"
android:layout_width="166px" android:layout_height="98px"
android:orientation="vertical">
<RadioButton android:id="@+id/widget44"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="RadioButton">
</RadioButton>
<RadioButton android:id="@+id/widget45"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="RadioButton">
</RadioButton>
</RadioGroup>
</LinearLayout>
</FrameLayout>

java代码：
super.onCreate(savedInstanceState);
myTabhost=this.getTabHost();
//get Tabhost
LayoutInflater.from(this).inflate(R.layout.main, myTabhost.getTabContentView(), true);
myTabhost.setBackgroundColor(Color.argb(150, 22, 70, 150));

myTabhost
.addTab(myTabhost.newTabSpec("One")// make a new Tab
.setIndicator("A")
// set the Title and Icon
.setContent(R.id.widget_layout_Blue));
// set the layout

myTabhost
.addTab(myTabhost.newTabSpec("Two")// make a new Tab
.setIndicator("B",
getResources().getDrawable(R.drawable.mumule))
// set the Title and Icon
.setContent(R.id.widget_layout_green));
// set the layout

myTabhost
.addTab(myTabhost.newTabSpec("Three")// make a new Tab
.setIndicator("C",
getResources().getDrawable(R.drawable.notepad))
// set the Title and Icon
.setContent(R.id.widget_layout_red));