Android学习笔记二：TabHost控件的使用说明收集

出处：http://blog.sina.com.cn/s/blog_6bec714e0100tv12.html

在使用了一个TabHost控件，下面我们来详细讲解下这个控件以及使用这个控件时，应该注意的一些问题。

使用TabHost有两种方法：

一种是继承TabActivity；

一种是不继承TabActivity；在这里我要讲解的是继承TabActivity的；首先我们得写好main.xml布局文件，在写这个布局文件时要注意，使用TabHost一定要有TabWidget、FramLayout这两个控件，并且TabWidget必须使用系统ID @android:id/tabs；FrameLayout作为标签内容的基本框架，也必须使用系统ID
@android:id/tabcontent（TabWidget最好在FrameLayout上声时要不然TabWidget不会显示，但不会报错）；而TabHost可以自定义ID，这是为了在系统初始化时能够使用，否则会报错！

示例一（最基本的）代码：

1）先建一个布局文件：res/layout/tab_demo.xml

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

<FrameLayout

android:id="@+id/dd"

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

android:layout_width="match_parent"

android:orientation="vertical"

android:layout_height="match_parent">

<TextView android:id="@+id/tab_demo_tv1"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="tab_demo_tv1"

/>

<TextView android:id="@+id/tab_demo_tv2"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="tab_demo_tv2"

/>

<TextView android:id="@+id/tab_demo_tv3"

android:layout_width="fill_parent"

android:layout_height="fill_parent"

android:text="tab_demo_tv3"

/>

</FrameLayout>

2)

tabHost = getTabHost();

tabHost.setBackgroundColor(Color.argb(150, 22, 70, 150));//设置背景

LayoutInflater.from(this).inflate(R.layout.main, tabHost.getTabContentView(), true); //初使化布局控件

//R.layout.main 存放Tab布局

//通过TabHost获得存放Tab标签页内容的FrameLayout

//是否将inflate 拴系到根布局元素上

tabHost.addTab(tabHost.newTabSpec("tab11").setIndicator("Tab1", getResources().getDrawable(R.drawable.abc)).setContent(R.id.tab_demo_tv1));

tabHost.addTab(tabHost.newTabSpec("tab22").setIndicator("Tab2", null).setContent(R.id.tab_demo_tv2));

tabHost.addTab(tabHost.newTabSpec("tab33").setIndicator("Tab3", null).setContent(R.id.tab_demo_tv3));

//增加tab改变事件

tabHost.setOnTabChangedListener(new OnTabChangeListener() {

@Override

public void onTabChanged(String s) {

System.out.println(s+"s对应这里面设的名称tabHost.newTabSpec('tab11')－－－tab11");

}

});

示例二（最基本的通过Intent来改变Tab里的内容）代码：

1）res/layout/main.xml

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

<TabHost android:id="@android:id/tabhost" android:layout_width="fill_parent"

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

<LinearLayout android:orientation="vertical"

android:background="#DADADA"

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" android:layout_weight="0.0" />

<!-- 上下两个标签 是必须要有的-->

<FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="0.0dip" android:layout_weight="1.0" />

</LinearLayout>

</TabHost>

2）
public class MainActivity extends TabActivity {

TabHost
tabs ;

@Override

public
void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

tabs
= getTabHost();

TabSpec
tab2 = tabs.newTabSpec("TwoActivity");

tab2.setIndicator("tab2"); //
设置tab1的名称

tab2.setContent(new
Intent(MainActivity.this,TwoActivity.class)); //
关联控件

tabs.addTab(tab2);

//设置Tab1

TabSpec
tab1 = tabs.newTabSpec("OneActivity");

tab1.setIndicator("tab1"); //
设置tab1的名称

tab1.setContent(new
Intent(MainActivity.this,OneActivity.class)); //
关联控件

tabs.addTab(tab1); //
添加tab1

TabSpec
tab3 = tabs.newTabSpec("TwoActivity");

tab3.setIndicator("tab3"); //
设置tab1的名称

tab3.setContent(new
Intent(MainActivity.this,TwoActivity.class)); //
关联控件

tabs.addTab(tab3);

tabs.setCurrentTab(0); //显示一个Tab标签
作为当前的显示业

}

}

问：下面我们来说明一下如何改变每个标签的大小和位置呢？如何设置每个标签的背景颜色或图片呢

呵呵，在这里我们用getTabWidget()方法取TabWidget对象。通过该对象使用getChildAt(int
i)来取得每个标签，取得每个标签之后，我们就可以使用下面代码来设置标签内容中的位置了：

变每个标签的大小和位置：

TabWidget mTabWidget = tabHost.getTabWidget();

for(int i=0;i<mTabWidget.getChildCount();i++){

//设置选项卡的宽度

mTabWidget.getChildAt(i).getLayoutParams().height=50;

//设置选项卡的高度

mTabWidget.getChildAt(i).getLayoutParams().width=60;

}

每个标签的背景颜色或图片：

tabHost.addTab(tabHost.newTabSpec("tab33").setIndicator(createView("Tab3",R.drawable.abc)).setContent(R.id.tab_demo_tv3));

public TextView createView(String str,int id){

TextView text = new TextView(this);

text.setText(str);

text.setTextSize(24);

text.setBackgroundResource(id);

return text;

}

下面是效果



实现底部标签页切换功能：(说明：切换后的每个Activity后只会存在第一次创建的实例)



1）先声明一个TabHost布局：main.xml
<?xml version="1.0" encoding="UTF-8"?>

<TabHost android:id="@android:id/tabhost" android:layout_width="fill_parent"

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

<LinearLayout
android:orientation="vertical"

android:background="#DADADA"

android:layout_width="fill_parent"
android:layout_height="fill_parent">

<TabWidget
android:id="@android:id/tabs" android:visibility="gone" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_weight="0.0" />

<FrameLayout
android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="0.0dip" android:layout_weight="1.0" />

<include
layout = "@layout/buttom" /> <!--
导入一个底部模块 -->

</LinearLayout>

</TabHost>

2）buttom.xml

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

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

android:layout_width="fill_parent" android:layout_height="wrap_content">

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

android:layout_width="fill_parent" android:layout_height="wrap_content"

android:stretchColumns="*">

<TableRow>

<Button android:id="@+id/left_button" android:text="One"

android:gravity="center" android:textColor="#FF0101"

android:layout_alignParentLeft="true" android:padding="5dip"

android:background="@drawable/attend_cancel" android:layout_height="wrap_content" />

<Button android:id="@+id/center_button" android:text="TWO"

android:layout_marginLeft="1dip" android:gravity="center"

android:textColor="#FF0101" android:padding="5dip"

android:background="@drawable/attend_cancel" android:layout_height="wrap_content" />

<Button android:id="@+id/right_button" android:text="Three"

android:layout_marginLeft="1dip" android:gravity="center"

android:textColor="#FF0101" android:padding="5dip"

android:background="@drawable/attend_cancel" android:layout_height="wrap_content" />

</TableRow>

</TableLayout>

</LinearLayout>

3）创建四的Activity类:

MainActivity.java OneActivity.java ThreeActivity.java TwoActivity.java

4)MainActivity.java代码：

public class MainActivity extends TabActivity implements OnClickListener{

TabHost tabs ;

Button but1,but2,but3;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

tabs = getTabHost();

//设置Tab1

TabSpec tab1 = tabs.newTabSpec("OneActivity");

tab1.setIndicator("tab1"); // 设置tab1的名称

tab1.setContent(new Intent(MainActivity.this,OneActivity.class)); // 关联控件

tabs.addTab(tab1);

// 添加tab1

TabSpec tab2 = tabs.newTabSpec("TwoActivity");

tab2.setIndicator("tab2"); // 设置tab1的名称

tab2.setContent(new Intent(MainActivity.this,TwoActivity.class)); // 关联控件

tabs.addTab(tab2);

TabSpec tab3 = tabs.newTabSpec("ThreeActivity");

tab3.setIndicator("tab3"); // 设置tab1的名称

tab3.setContent(new Intent(MainActivity.this,ThreeActivity.class)); // 关联控件

tabs.addTab(tab3);

tabs.setCurrentTab(0);

but1 =(Button)findViewById(R.id.left_button);

but1.setOnClickListener(this);

but2 =(Button)findViewById(R.id.center_button);

but2.setOnClickListener(this);

but3 =(Button)findViewById(R.id.right_button);

but3.setOnClickListener(this);

}

@Override

public void onClick(View view) {

System.out.println("=");

if(view == but1){

//下面两种设定是一样的效果

tabs.setCurrentTab(0);

//tabs.setCurrentTabByTag("OneActivity");

}else if(view == but2){

tabs.setCurrentTabByTag("TwoActivity");

}else if(view == but3){

tabs.setCurrentTabByTag("ThreeActivity");

}else{

tabs.setCurrentTab(0);

}

}

}

这样就可以完成底部切换的功能了。

//下面是参考的一些博客网址

/article/8820488.html

/article/9012259.html

http://www.eoeandroid.com/thread-1035-1-1.html

出处：/article/8447925.html

最近研究了一下Contacts源码，仿照上面自己写了一个TabHostTest程序，现整理如下：

main.xml布局文件：

[html] view
plain copy

<?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="match_parent"

android:layout_height="match_parent">

<LinearLayout

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="match_parent">

<TabWidget android:id="@android:id/tabs"

android:layout_width="match_parent"

android:layout_height="wrap_content"

/>

<FrameLayout android:id="@android:id/tabcontent"

android:layout_width="match_parent"

android:layout_height="0dip"

android:layout_weight="1"

/>

</LinearLayout>

</TabHost>

inner.xml文件：

[html] view
plain copy

<?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="match_parent"

android:layout_height="match_parent">

<LinearLayout

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="match_parent">

s

<FrameLayout android:id="@android:id/tabcontent"

android:layout_width="fill_parent"

android:layout_height="0dip"

android:layout_weight="1"

/>

<TabWidget android:id="@android:id/tabs"

android:layout_width="fill_parent"

android:layout_height="wrap_content"

/>

</LinearLayout>

</TabHost>

Main.Java （主Activity类）：

[java] view
plain copy

package com.android.test;

import android.app.Activity;

import android.app.TabActivity;

import android.content.Intent;

import android.os.Bundle;

import android.provider.CallLog.Calls;

import android.provider.Contacts.Intents.UI;

import android.view.Window;

import android.widget.TabHost;

public class Main extends TabActivity implements TabHost.OnTabChangeListener {

private static final int TAB_INDEX_DIALER = 0;

private static final int TAB_INDEX_CALL_LOG = 1;

private static final int TAB_INDEX_CONTACTS = 2;

private static final int TAB_INDEX_FAVORITES = 3;

private TabHost mTabHost;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

final Intent intent = getIntent();

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.main);

mTabHost = getTabHost();

mTabHost.setOnTabChangedListener(this);

// Setup the tabs

setupDialerTab();

setupCallLogTab();

setupContactsTab();

setupFavoritesTab();

setCurrentTab(intent);

}

public void onTabChanged(String tabId) {

Activity activity = getLocalActivityManager().getActivity(tabId);

if (activity != null) {

activity.onWindowFocusChanged(true);

}

}

private void setupCallLogTab() {

// Force the class since overriding tab entries doesn't work

Intent intent = new Intent("com.android.phone.action.RECENT_CALLS");

intent.setClass(this, Inner.class);

mTabHost.addTab(mTabHost.newTabSpec("call_log")

.setIndicator("通话记录",

getResources().getDrawable(R.drawable.ic_tab_unselected_recent))

.setContent(intent));

}

private void setupDialerTab() {

Intent intent = new Intent("com.android.phone.action.TOUCH_DIALER");

intent.setClass(this, Inner.class);

mTabHost.addTab(mTabHost.newTabSpec("dialer")

.setIndicator("拨号",

getResources().getDrawable(R.drawable.ic_tab_unselected_dialer))

.setContent(intent));

}

private void setupContactsTab() {

Intent intent = new Intent(UI.LIST_DEFAULT);

intent.setClass(this, Main.class);

mTabHost.addTab(mTabHost.newTabSpec("contacts")

.setIndicator("通讯录",

getResources().getDrawable(R.drawable.ic_tab_unselected_contacts))

.setContent(intent));

}

private void setupFavoritesTab() {

Intent intent = new Intent(UI.LIST_STREQUENT_ACTION);

intent.setClass(this, Inner.class);

mTabHost.addTab(mTabHost.newTabSpec("favorites")

.setIndicator("收藏",

getResources().getDrawable(R.drawable.ic_tab_unselected_starred))

.setContent(intent));

}

/**

* Sets the current tab based on the intent's request type

*

* @param intent Intent that contains information about which tab should be selected

*/

private void setCurrentTab(Intent intent) {

// Dismiss menu provided by any children activities

Activity activity = getLocalActivityManager().

getActivity(mTabHost.getCurrentTabTag());

if (activity != null) {

activity.closeOptionsMenu();

}

// Tell the children activities that they should ignore any possible saved

// state and instead reload their state from the parent's intent

intent.putExtra("", true);

// Choose the tab based on the inbound intent

String componentName = intent.getComponent().getClassName();

if (getClass().getName().equals(componentName)) {

if (false) {

//in a call, show the dialer tab(which allows going back to the call)

mTabHost.setCurrentTab(TAB_INDEX_DIALER);

} else if ((intent.getFlags() & Intent.FLAG_ACTIVITY_LAUNCHED_FROM_HISTORY) != 0) {

// launched from history (long-press home) --> nothing to change

} else if (true) {

// The dialer was explicitly requested

mTabHost.setCurrentTab(TAB_INDEX_DIALER);

}

}

}

}

Inner.java类：

[java] view
plain copy

package com.android.test;

import android.app.TabActivity;

import android.content.Intent;

import android.os.Bundle;

import android.view.Window;

import android.widget.TabHost;

import android.widget.TabWidget;

import android.widget.TextView;

public class Inner extends TabActivity implements TabHost.OnTabChangeListener {

private static final int TAB_INDEX_ALL = 0;

private static final int TAB_INDEX_MISSED = 1;

private static final int TAB_INDEX_OUTGOING = 2;

private static final int TAB_INDEX_RECEIVED = 3;

private TabHost mTabHost;

private TabWidget mTabWidget;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.inner);

mTabHost = getTabHost();

mTabHost.setOnTabChangedListener(this);

setupTabs();

mTabWidget = mTabHost.getTabWidget();

mTabWidget.setStripEnabled(false);

for (int i = 0; i < mTabWidget.getChildCount(); i++) {

TextView tv = (TextView) mTabWidget.getChildAt(i).findViewById(

android.R.id.title);

tv.setTextColor(this.getResources().getColorStateList(

android.R.color.white));

tv.setPadding(0, 0, 0,(int) tv.getTextSize());

tv.setText("Tab" + i);

mTabWidget.getChildAt(i).getLayoutParams().height =(int ) (3* tv.getTextSize());

mTabWidget.getChildAt(i).setBackgroundResource(R.drawable.tab_bg);

}

}

public void onTabChanged(String tabId) {

}

private void setupTabs() {

mTabHost.addTab(mTabHost.newTabSpec("all").setIndicator(

getString(R.string.inner)).setContent(

new Intent(this, Other.class)));

mTabHost.addTab(mTabHost.newTabSpec("Missed").setIndicator(

getString(R.string.inner)).setContent(

new Intent(this, Other.class)));

mTabHost.addTab(mTabHost.newTabSpec("Outgoing").setIndicator(

getString(R.string.inner)).setContent(

new Intent(this, Other.class)));

mTabHost.addTab(mTabHost.newTabSpec("Received").setIndicator(

getString(R.string.inner)).setContent(

new Intent(this, Other.class)));

}

}

效果图如下：