Android中TabWidget的应用

 

步骤

1.建立两个Activity，作为tab内容 （我这里是OneActivity、TestActivity)

public class OneActivity extends Activity {
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
 
        TextView textview = new TextView(this);
        textview.setText("This is the Artists tab");
        setContentView(textview);
    }
}

2.在layout文件夹中建立tab.xml用于怎样显示tab页面

注意：TabHost ，TabWidget ，FrameLayout的ID必须分别为@android:id/tabhost，@android:id/tabs，@android:id/tabcontent
另外还要注意一下android:layout_width宽度和android:layout_height高度的取值，还要LinearLayout的android:orientation=”vertical”（LinearLayout默认是横向的）当你看到布局和我不一样时你就要考虑一下这里是不是错了。（= =！因为我错过）

<?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: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"></TabWidget>
  <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:padding="5dp" />
 </LinearLayout>
</TabHost>

3.新建一个类TabWidget.java，继承TabActivity类

package com.fatkun;
 
import android.app.TabActivity;
import android.content.Intent;
import android.content.res.Resources;
import android.os.Bundle;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;
 
public class TabWidget extends TabActivity {
 
 /** Called when the activity is first created. */
 @Override
 public void onCreate(Bundle savedInstanceState) {
     super.onCreate(savedInstanceState);
     setContentView(R.layout.tab);//这里使用了上面创建的xml文件（Tab页面的布局）
     Resources res = getResources(); // Resource object to get Drawables
     TabHost tabHost = getTabHost();  // The activity TabHost
     TabSpec spec;
     Intent intent;  // Reusable Intent for each tab
 
   //第一个TAB
     intent = new Intent(this,OneActivity.class);//新建一个Intent用作Tab1显示的内容
     spec = tabHost.newTabSpec("tab1")//新建一个 Tab
     .setIndicator("Tab1", res.getDrawable(android.R.drawable.ic_media_play))//设置名称以及图标
     .setContent(intent);//设置显示的intent，这里的参数也可以是R.id.xxx
     tabHost.addTab(spec);//添加进tabHost
 
     //第二个TAB
     intent = new Intent(this,TestActivity.class);//第二个Intent用作Tab1显示的内容
     spec = tabHost.newTabSpec("tab2")//新建一个 Tab
     .setIndicator("Tab2", res.getDrawable(android.R.drawable.ic_menu_camera))//设置名称以及图标
     .setContent(intent);//设置显示的intent，这里的参数也可以是R.id.xxx
     tabHost.addTab(spec);//添加进tabHost
 
     tabHost.setCurrentTab(1);
 }
 
}

4.最后一步，在AndroidManifest.xml加入你的Activity

android:theme=”@android:style/Theme.NoTitleBar”是可以使得TabWidget窗口没有标题，多点空间显示

<activity android:name="TabWidget" android:theme="@android:style/Theme.NoTitleBar"></activity>
    <activity android:name="OneActivity"></activity>
    <activity android:name="TestActivity"></activity>

---

1、选项卡中的布局如果想从setContextView(R.layout.tab)指定，那么xml配置文件应该如下编写：
<?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="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<!-- 如果代码中使用setContextView()指定布局文件，必须加入该控件的声明，否则无法运行！而且TabWidget后需要使用Framelayout布局 -->
<TabWidget
android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
..................................
这样才可以。
2、如果在代码中不采取setContextView()方式加载布局，则在程序，动态选择布局：
TabHost mTobHost=getTabHost();
LayoutInflater.from(this).inflate(R.layout.main,mTobHost.getTabContentView(),true);
mTobHost.addTab(mTobHost.newTabSpec("---tab1").setIndicator("TAB1").setContent(R.id.txtOne));
mTobHost.addTab(mTobHost.newTabSpec("---tab2").setIndicator("TAB2").setContent(R.id.txtTwo));
mTobHost.addTab(mTobHost.newTabSpec("---tab3").setIndicator("TAB3").setContent(R.id.txtThree));
mTobHost.setCurrentTab(0);
这样完成。
如果想实现采取第一种方式实现选项卡位于屏幕的下方，将布局方式为RelativeLayout,同时设置TabWidget的 android:layout_alignParentBottom="true"。

其他的一些方法：

// 声明TabHost对象
TabHost xh_TabHost;

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

/**
* 为TabHost添加标签 新建一个newTabSped(newTabSpec) 设置其标签和图标（setIndicator）
* 设置内容(setContent)
*/
// TabSpec 是TabHost的内部类 TabHost对象的 newTabSpec()方法返回一个TabSpec对象 这个关系要搞清楚
/*
* 源码里边是这么写的 public TabSpec newTabSpec(String tag) { return new
* TabSpec(tag); }
*/

xh_TabHost.addTab(xh_TabHost.newTabSpec("tab_test1")
// setIndicator()此方法用来设置标签和图表
.setIndicator("TAB 1",
getResources().getDrawable(R.drawable.img1))
// 指定内容为一个TextView --->public TabHost.TabSpec setContent (int
// viewId) 此方法需要一个 viewId 作为参数
.setContent(R.id.textview1));

xh_TabHost.addTab(xh_TabHost.newTabSpec("tab_test2").setIndicator(
"TAB 2", getResources().getDrawable(R.drawable.img2)) .setContent(R.id.textview2));

xh_TabHost.addTab(xh_TabHost.newTabSpec("tab_test3").setIndicator(
"TAB 3", getResources().getDrawable(R.drawable.img3)) .setContent(R.id.textview3));

// 设置TabHost的背景颜色
xh_TabHost.setBackgroundColor(Color.argb(150, 22, 70, 150));

// 设置TabHost的背景图片资源
xh_TabHost.setBackgroundResource(R.drawable.bg2);

// 设置当前显示哪一个标签 我的理解就是当你第一次启动程序默认显示那个标签 这里是指定的选项卡的ID从0开始
xh_TabHost.setCurrentTab(0);

// 标签切换事件处理，setOnTabChangedListener 注意是标签切换事件不是点击事件
// 就是从一个标签切换到另外一个标签会触发的事件
xh_TabHost.setOnTabChangedListener(new OnTabChangeListener() {
@Override
public void onTabChanged(String tabId) {
// 定义一个弹出式的对话框
Dialog dialog = new AlertDialog.Builder(Activity01.this) .setTitle("提示").setMessage("当前选中了：" + tabId + "标签") .setPositiveButton("确定", new DialogInterface.OnClickListener() {

@Override
public void onClick(DialogInterface dialog, int which) {
// 取消对话框
dialog.cancel();
}

}).create();// 创建出一个“确定”按钮
// 启动此对话框并且显示在屏幕上
dialog.show();