android开发之TabHost分页标签使用案例（带滑动效果）

1.首先看一下我们的项目目录结构

2.需要TableHost和TabSpec组件，这是HomeActivity类，它负责分发、跳转

package com.xiaobo.androidui;

import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.util.Log;
import android.view.GestureDetector;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.view.MotionEvent;
import android.view.View;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;

public class HomeActivity extends TabActivity {
	private GestureDetector gestureDetector;
	/** 记录当前分页ID */
	private int currentView = 0;
	private static int maxTabIndex = 2;
	// *********************************
	private static final int SWIPE_MIN_DISTANCE = 120;
	private static final int SWIPE_MAX_OFF_PATH = 250;
	private static final int SWIPE_THRESHOLD_VELOCITY = 200;
	View.OnTouchListener gestureListener;
	TabHost tabHost;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		initTabHost();

		gestureDetector = new GestureDetector(new MyGestureDetector());
		gestureListener = new View.OnTouchListener() {
			@Override
			public boolean onTouch(View v, MotionEvent event) {
				if (gestureDetector.onTouchEvent(event)) {
					return true;
				}
				return false;
			}
		};
	}

	private void initTabHost() {
		// 获取TabHost组件
		tabHost = this.getTabHost();

		// 新建一个标签页
		TabSpec firstTabSpec = tabHost.newTabSpec("First")
				.setIndicator("First");
		// 给标签页设置内容
		firstTabSpec.setContent(new Intent(HomeActivity.this,
				FirstActivity.class));
		tabHost.addTab(firstTabSpec);

		// 新建一个标签页
		TabSpec secondTabSpec = tabHost.newTabSpec("Second").setIndicator(
				"Second");
		// 给标签页设置内容
		secondTabSpec.setContent(new Intent(HomeActivity.this,
				SecondActivity.class));
		tabHost.addTab(secondTabSpec);

		// 新建一个标签页
		TabSpec thirdTabSpec = tabHost.newTabSpec("Third")
				.setIndicator("Third");
		// 给标签页设置内容
		thirdTabSpec.setContent(new Intent(HomeActivity.this,
				ThirdActivity.class));
		tabHost.addTab(thirdTabSpec);

		// 设置当前显示第二页
		tabHost.setCurrentTab(1);
	}

	@Override
	public boolean dispatchTouchEvent(MotionEvent ev) {
		if (gestureDetector.onTouchEvent(ev)) {
			ev.setAction(MotionEvent.ACTION_CANCEL);
		}
		return super.dispatchTouchEvent(ev);
	}

	// 左右滑动刚好页面也有滑动效果
	class MyGestureDetector extends SimpleOnGestureListener {
		@Override
		public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
				float velocityY) {
			System.out.println("************");
			try {
				if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH)
					return false;
				// right to left swipe
				if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE
						&& Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
					Log.i("test", "right");
					if (currentView == maxTabIndex) {
						currentView = 0;
					} else {
						currentView++;
					}
					tabHost.setCurrentTab(currentView);
				} else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE
						&& Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
					Log.i("test", "left");
					if (currentView == 0) {
						currentView = maxTabIndex;
					} else {
						currentView--;
					}
					tabHost.setCurrentTab(currentView);
				}
			} catch (Exception e) {
			}
			return false;
		}
	}

}

3.这是FirstActivity类，它只需配置属于自己的布局文件就OK了，其他的几个Activity是一样的

package com.xiaobo.androidui;

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

public class FirstActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_first);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}

4.这是FirstActivity的布局文件，其他的几个Activity的布局文件是一样的

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".HomeActivity" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/first_tip" />

</RelativeLayout>

5.最后是AndroidManifest.xml配置文件

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

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

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.xiaobo.androidui.HomeActivity"
            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.xiaobo.androidui.FirstActivity"
            android:label="@string/first_tip">
        </activity>
        
        <activity 
            android:name="com.xiaobo.androidui.SecondActivity"
            android:label="@string/second_tip">
        </activity>
        
        <activity 
            android:name="com.xiaobo.androidui.ThirdActivity"
            android:label="@string/third_tip">
        </activity>
        
    </application>

</manifest>

6.效果图