Android之选项卡

1.Android选项卡主要由TabHost，TabWidget，FrameLayout三个组件组成，用于实现一个多标签页的用户界面，通过它可以将一个复杂的对话框分割成若干个标签页，实现对信息的分类显示和管理。使用选项卡可以使界面简洁大方，也可以有效地减少窗体的个数。下面的一个例子，即可实现选项卡，分成多标签页的界面。

2.首先，新建一个Android项目，项目名为TabActivityTest，接下来先打开activity_main.xml文件，对其布局，添加实现选项卡所需的TabHost，TabWidget和FrameLayout组件

activity_main.xml文件：

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">
        
        <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="match_parent">         
        </FrameLayout>
        
    </LinearLayout>
    
    
</TabHost>

注：这里所添加的三个控件中的id属性必须使用系统的id，即TabHost，TabWidget，FrameLayout的id属性分别使用系统的id，如下面的代码：

 

<TabHost android:id="@android:id/tabhost"/>
<TabWidget android:id="@android:id/tabs"/>
<FrameLayout android:id="@android:id/tabcontent"/>

如果使用平常的id属性设置的话，程序会出现异常。

3.接下来，编写各标签页中要显示内容所对应的XML布局文件，其中这里我新建了3个xml布局文件，分别为tab01.xml，tab02.xml，tab03.xml文件，代码附上：

tab01.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" >

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center_vertical|center_horizontal"
        android:text="@string/text"
        android:textColor="#CC99CC"
        android:textSize="21sp" />

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/text1"
        android:textSize="19sp" />

</LinearLayout>

tab02.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" >
    
	<TextView
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:text="@string/text2"
	    android:textSize="21sp"
	    android:gravity="center_vertical|center_horizontal"
	    android:textColor="#9999CC"/>
	
	<TextView
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:text="@string/text3"
	    android:textSize="19sp"/>
    
</LinearLayout>

tab03.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" >
    
<TextView
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:text="@string/text4"
	    android:textSize="21sp"
	    android:gravity="center_vertical|center_horizontal"
	    android:textColor="#FFCCCC"/>
	
	<TextView
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:text="@string/text5"
	    android:textSize="19sp"/>
	
	<Button
	    android:id="@+id/button1"
	    android:layout_width="wrap_content"
	    android:layout_height="wrap_content"
	    android:text="@string/button1"/>
    
</LinearLayout>

4.这里，先附上项目所需的strings.xml文件：

strings.xml文件：

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

    <string name="app_name">TabActivityTest</string>
    <string name="hello_world">Hello world!</string>
    <string name="action_settings">Settings</string>
    <string name="text">热血燃烧</string>
	<string name="text1">岁月无情仍愿意，为你闯开新故事,情和义今天我知，是我不需一再怀疑,世上无情人在变，义气本色不太易,但我知，今天到此，生死与你创造名字</string>
	<string name="text2">知己，自己</string>
	<string name="text3">朋友情义，随意去说说太容易,自己知，唯知己可以，有苦有难时，永不容辞,是知己，自己怎可以，到天塌下时，各做各事</string>
	<string name="text4">关于作者</string>
	<string name="text5">作者:小熊，我是一个快乐的小熊，但是我是一个孤独的程序猿，好好学习，天天向上，加油！小熊，一切都会好的！</string>
	<string name="button1">点我</string>
</resources>

5.下面，就可以打开src目录包下的MainActivity.java文件，这个类继承于TabActivity，实现跳转三个Activity，并显示不同的界面，这里新建了三个Activity，分别为Tab1Activity.java，Tab2Activity.java，Tab3Activity.java文件，分别显示三个布局文件tab01.xml，tab02.xml，tab03.xml文件，下面附上Tab1Activity.java，Tab2Activity.java，Tab3Activity.java文件，最后再附上MainActivity.java文件：

Tab1Activity.java文件：

package com.tabactivitytest;

import android.app.Activity;
import android.os.Bundle;

public class Tab1Activity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tab01);
	}
	
}

Tab2Activity.java文件：

package com.tabactivitytest;

import android.app.Activity;
import android.os.Bundle;

public class Tab2Activity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tab02);
	}
	
}

Tab3Activity.java文件：

package com.tabactivitytest;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.Toast;

public class Tab3Activity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tab03);
		Button button1=(Button)findViewById(R.id.button1);//获取按钮组件
		//添加单击按钮事件监听器
		button1.setOnClickListener(new OnClickListener(){

			@Override
			public void onClick(View v) {
				// 弹出消息提示框
				Toast.makeText(Tab3Activity.this, "向上吧！少年，我们一起加油！", Toast.LENGTH_SHORT).show();
			}
			
		});
	}
	
}

MainActivity.java文件：

package com.tabactivitytest;

import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.widget.TabHost;

@SuppressWarnings("deprecation")	//避免编译器出现警告信息，因为TabActivity已经过期，强制使用会出现大量的警告信息，这行代码将因API过期所产生的警告信息屏蔽
public class MainActivity extends TabActivity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		//TabHost tabHost=(TabHost)findViewById(android.R.id.tabhost);//获得TabHost组件
		//tabHost.setup();//方法初始化
		TabHost tabHost=getTabHost();//获得TabHost,也可以用前两行代码实现
		tabHost.addTab(tabHost.newTabSpec("tab01").setIndicator("热血燃烧").setContent(new Intent().setClass(this, Tab1Activity.class)));//添加第一个标签页,点击跳转到Tab1Activity
		tabHost.addTab(tabHost.newTabSpec("tab02").setIndicator("知己，自己").setContent(new Intent().setClass(this, Tab2Activity.class)));//添加第二个标签页,点击跳转到Tab2Activity
		tabHost.addTab(tabHost.newTabSpec("tab03").setIndicator("作者信息").setContent(new Intent().setClass(this, Tab3Activity.class)));//点击作者信息选项卡跳转到Tab3Activity
	}

}

6.接下来不应该忘记在AndroidManifest.xml配置文件声明那三个未声明的Activity，代码附上：

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.tabactivitytest"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="19" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.tabactivitytest.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name="com.tabactivitytest.Tab1Activity" />
        <activity android:name="com.tabactivitytest.Tab2Activity" />
        <activity android:name="com.tabactivitytest.Tab3Activity" />
    </application>

</manifest>

7.以上就是全部内容，运行此项目，运行后如下图所示：

点击知己，自己选项，如下图所示：

点击作者信息，效果如下：

点击“点我”按钮，如下图所示：

8.以上内容仅供大家学习参考，写得不好，请见谅，如有错误请指出，谢谢！