用TabAcitivity制作Android顶部选项卡

最新推荐文章于 2021-05-28 15:31:22 发布

原创最新推荐文章于 2021-05-28 15:31:22 发布 · 851 阅读

3 ·

CC 4.0 BY-SA版权

android 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了如何使用TabActivity创建Android顶部选项卡。步骤包括继承TabActivity创建类，设计XML布局文件添加三个layout，并在TabActivity中绑定布局与活动，设置监听。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

先上结果截图:

接下来讲怎么做，很简单，两步即可：

1.新建一个选项卡的class继承TabActivity，新建一个对应的xml，xml里面加入三个layout。

为啥要新建三个layout呢？因为我的选项卡要三个界面，所以要新建三个layout，根据每个layout的id，可以将其与选项卡绑定，做成三个选项卡界面。

我的xml代码如下:

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

    <LinearLayout 
        android:id="@+id/tab01"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no1_1"
           android:textSize="8pt"/>
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no1_2"
           android:textSize="8pt"/>
    </LinearLayout>

    <LinearLayout 
        android:id="@+id/tab02"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no2_1"
           android:textSize="8pt"/>
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no2_2"
           android:textSize="8pt"/>
    </LinearLayout>
    <LinearLayout 
        android:id="@+id/tab03"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no3_1"
           android:textSize="8pt"/>
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no3_2"
           android:textSize="8pt"/>
    </LinearLayout>

    <LinearLayout 
        android:id="@+id/tab04"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no4_1"
           android:textSize="8pt"/>
       <TextView 
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="no4_2"
           android:textSize="8pt"/>
    </LinearLayout>
</LinearLayout>

2.在TabAcitivity里面将xml和Activity绑定，以及编写监听。

代码如下，很简单一看就懂。

package com.example.xiongy;
import android.app.TabActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.widget.TabHost;
import android.widget.Toast;
import android.widget.TabHost.OnTabChangeListener;

public class XXK extends TabActivity{
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		
		//下面的代码用于创建选项卡以及将选项卡和对应layout绑定，一看就懂。
		TabHost tabHost = getTabHost();
		LayoutInflater.from(this).inflate(R.layout.activity_xxk, tabHost.getTabContentView(),true);
		tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("快捷").setContent(R.id.tab01));
		tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("好友").setContent(R.id.tab02));
		tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("日志").setContent(R.id.tab03));
		tabHost.addTab(tabHost.newTabSpec("tab4").setIndicator("相册").setContent(R.id.tab04));
			
		//下面为监听代码，一看就懂
		tabHost.setOnTabChangedListener(new OnTabChangeListener() {
			
			@Override
			public void onTabChanged(String tabId) {
				// TODO Auto-generated method stub
				if(tabId.equals("tab1")) {
					Toast.makeText(XXK.this, "点了1", Toast.LENGTH_SHORT).show();
				}
				if(tabId.equals("tab2")) {
					Toast.makeText(XXK.this, "点了2", Toast.LENGTH_SHORT).show();
				}
				if(tabId.equals("tab3")) {
					Toast.makeText(XXK.this, "点了3", Toast.LENGTH_SHORT).show();
				}
				if(tabId.equals("tab4")) {
					Toast.makeText(XXK.this, "点了4", Toast.LENGTH_SHORT).show();
				}
			}
		});
	}
}

至此完毕，赶紧模拟器运行看看吧~