TabWidget/TabHost的两种使用方法

2023-10-13 18:52:04

1.概念

盛放Tab的容器就是TabHost。TabHost的实现有两种方式：

第一种继承TabActivity，从TabActivity中用getTabHost()方法获取TabHost。各个Tab中的内容在布局文件中定义就行了。

第二种方式，不继承TabActivity，在布局文件中定义TabHost即可，但是TabWidget的id必须是@android:id/tabs，FrameLayout的id必须是@android:id/tabcontent。

2、重要方法

　　　　addTab(TabHost.TabSpec tabSpec)：添加一项Tab页
　　　　clearAllTabs()：清除所有与之相关联的Tab页.
　　　　getCurrentTab():返回当前Tab页.
　　　　getTabContentView()：返回包含内容的FrameLayout
　　　　newTabSpec(String tag)：返回一个与之关联的新的TabSpec

3、基本步骤

1.布局文件，需要使用FrameLayout

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView android:id="@+id/view1"
        android:background="@drawable/b"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="页1"/>

    <TextView android:id="@+id/view2"
        android:background="@drawable/c"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="页2"/>

    <TextView android:id="@+id/view3"
        android:background="@drawable/d"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="页3"/>

</FrameLayout>

2.获得tabHost对象，可以继承TabActivity也可以继承Activity

3.获取次此abHost

4.设置布局

LayoutInflater.from(this).inflate(R.layout.tabhostpage, tabHost.getTabContentView(), true);

5.添加Tab页

tabHost.addTab(tabHost.newTabSpec("tab1")
                 .setIndicator("tab1")
                 .setContent(R.id.view1));
         tabHost.addTab(tabHost.newTabSpec("tab3")
                 .setIndicator("tab2")
                 .setContent(R.id.view2));
         tabHost.addTab(tabHost.newTabSpec("tab3")
                 .setIndicator("tab3")
                 .setContent(R.id.view3));

4.创建Tab的案例代码

第一种：使用系统自带写好的TabHost（及继承自TabActivity类）具体代码如下:

<?xml version="1.0" encoding="utf-8"?>  
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="fill_parent"  
    android:layout_height="fill_parent">  
    <LinearLayout android:id="@+id/tab1"  
        android:layout_width="fill_parent" android:layout_height="fill_parent"  
        androidrientation="vertical">  
        <TextView android:id="@+id/TextView1"  
            android:text="This is a tab1" android:layout_width="fill_parent"  
            android:layout_height="wrap_content">  
        </TextView>  
    </LinearLayout>  
    <LinearLayout android:id="@+id/tab2"  
        android:layout_width="fill_parent" android:layout_height="fill_parent"  
        androidrientation="vertical">  
        <TextView android:id="@+id/TextView2"  
            android:text="This is a tab2" android:layout_width="fill_parent"  
            android:layout_height="wrap_content">  
        </TextView>  
    </LinearLayout>  
    <LinearLayout android:id="@+id/tab3"  
        android:layout_width="fill_parent" android:layout_height="fill_parent"  
        androidrientation="vertical">  
        <TextView android:id="@+id/TextView3"  
            android:text="This is a tab3" android:layout_width="fill_parent"  
            android:layout_height="wrap_content">  
        </TextView>  
    </LinearLayout>  
</FrameLayout>

Java代码

package com.Aina.Android;  
  
import android.app.AlertDialog;  
import android.app.Dialog;  
import android.app.TabActivity;  
import android.content.DialogInterface;  
import android.os.Bundle;  
import android.view.LayoutInflater;  
import android.widget.TabHost;  
  
public class Test_TabWidget extends TabActivity {  
    /** Called when the activity is first created. */  
    private TabHost tabHost;  
  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        // setContentView(R.layout.main);  
        tabHost = this.getTabHost();  
        LayoutInflater li = LayoutInflater.from(this);  
        li.inflate(R.layout.main, tabHost.getTabContentView(), true);  
        tabHost.addTab(tabHost.newTabSpec("Tab_1").setContent(R.id.tab1)  
                .setIndicator("TAB1",  
                        this.getResources().getDrawable(R.drawable.img1)));  
        tabHost.addTab(tabHost.newTabSpec("Tab_2").setContent(R.id.tab2)  
                .setIndicator("TAB2",  
                        this.getResources().getDrawable(R.drawable.img2)));  
        tabHost.addTab(tabHost.newTabSpec("Tab_3").setContent(R.id.tab3)  
                .setIndicator("TAB3",  
                        this.getResources().getDrawable(R.drawable.img3)));  
        tabHost.setCurrentTab(1);  
//      tabHost.setBackgroundColor(Color.GRAY);  
        tabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {  
  
            public void onTabChanged(String tabId) {  
                Dialog dialog = new AlertDialog.Builder(Test_TabWidget.this)  
                        .setTitle("提示").setMessage(  
                                "选中了" + tabId + "选项卡").setIcon(R.drawable.icon).setPositiveButton("确定", new DialogInterface.OnClickListener(){  
  
                                    public void onClick(DialogInterface dialog,  
                                            int which) {  
                                        // TODO Auto-generated method stub  
                                          
                                    }  
                                      
                                }).create();  
                dialog.show();  
  
            }  
  
        });  
    }  
}

第二种：就是定义我们自己的tabHost：不用继承TabActivity，具体代码如下:

<?xml version="1.0" encoding="utf-8"?>  
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"  
    android:id="@+id/TabHost01" android:layout_width="fill_parent"  
    android:layout_height="fill_parent">  
    <LinearLayout android:layout_width="fill_parent"  
        android:orientation="vertical" android:layout_height="fill_parent">  
        <TabWidget android:id="@android:id/tabs"  
            android:layout_width="fill_parent"  
            android:layout_height="wrap_content" />  
        <FrameLayout android:id="@android:id/tabcontent"  
            android:layout_width="fill_parent"  
            android:layout_height="fill_parent">  
            <LinearLayout android:id="@+id/LinearLayout1"  
                android:layout_width="fill_parent"  
                android:layout_height="wrap_content">  
                <TextView android:text="one"  
                    android:id="@+id/TextView01" android:layout_width="wrap_content"  
                    android:layout_height="wrap_content">  
                </TextView>  
            </LinearLayout>  
            <LinearLayout android:id="@+id/LinearLayout2"  
                android:layout_width="wrap_content"  
                android:layout_height="wrap_content">  
                <TextView android:text="two"  
                    android:id="@+id/TextView02" android:layout_width="fill_parent"  
                    android:layout_height="wrap_content">  
                </TextView>  
            </LinearLayout>  
            <LinearLayout android:id="@+id/LinearLayout3"  
                android:layout_width="wrap_content"  
                android:layout_height="wrap_content">  
                <TextView android:text="three"  
                    android:id="@+id/TextView03" android:layout_width="fill_parent"  
                    android:layout_height="wrap_content">  
                </TextView>  
            </LinearLayout>  
        </FrameLayout>  
    </LinearLayout>  
</TabHost>

Java代码

package com.Aina.Android;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.util.Log;  
import android.view.LayoutInflater;  
import android.widget.TabHost;  
  
public class Test_TabHost extends Activity {  
    /** Called when the activity is first created. */  
    private TabHost tabHost;  
  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);  
        try{  
            tabHost = (TabHost) this.findViewById(R.id.TabHost01);  
            tabHost.setup();  
              
            tabHost.addTab(tabHost.newTabSpec("tab_1")  
                    .setContent(R.id.LinearLayout1)  
                    .setIndicator("TAB1",this.getResources().getDrawable(R.drawable.img1)));  
            tabHost.addTab(tabHost.newTabSpec("tab_2")  
                    .setContent(R.id.LinearLayout2).setIndicator("TAB2",  
                            this.getResources().getDrawable(R.drawable.img2)));  
            tabHost.addTab(tabHost.newTabSpec("tab_3")  
                    .setContent(R.id.LinearLayout3).setIndicator("TAB3",  
                            this.getResources().getDrawable(R.drawable.img3)));  
            tabHost.setCurrentTab(1);  
        }catch(Exception ex){  
            ex.printStackTrace();  
            Log.d("EXCEPTION", ex.getMessage());  
        }  
  
    }  
}

注意：第二种方法时布局文件中的TabWidget的id必须定义为：android:id="@android:id/tabs"，FrameLayout的id必须定义为：android:id="@android:id/tabcontent" 其它控件没有限制，否则报错。

5、Tab添加事件的两种方法

3.1方法1，通过匿名内部类的方式注册监听事件

tabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {  
  
            public void onTabChanged(String tabId) {  
                Dialog dialog = new AlertDialog.Builder(Test_TabWidget.this)  
                        .setTitle("提示").setMessage(  
                                "选中了" + tabId + "选项卡").setIcon(R.drawable.icon).setPositiveButton("确定", new DialogInterface.OnClickListener(){  
  
                                    public void onClick(DialogInterface dialog,  
                                            int which) {  
                                        // TODO Auto-generated method stub  
                                          
                                    }  
                                      
                                }).create();  
                dialog.show();  
  
            }  
  
        });

3.2通过所在的类接口OnTabChangeListener接口

public class IsvBookListActivity extends Activity implements OnTabChangeListener{
     public void onCreate(Bundle saveInstanceState){
          ...
          //为tab控件注册标签切换事件
          tabHost.setOnTabChangedListener(this);
          ...
     }
    
     public void onTabChanged(String tagString){
          if(tagString.equals("One")){
              
          }
          if(tagString.equals("Two")){
              
          }
          if(tagString.equals("Three")){
              
          }
     }

}

TabWidget/TabHost的两种使用方法

码农公寓

2、重要方法

3、基本步骤

4.创建Tab的案例代码

5、Tab添加事件的两种方法

相关文章