ViewPager+Fragment实现TabHost（可复用的类）

效果图：

之前写了一个基于ViewPager+Fragment实现的Tabhost（具体详情： http://blog.csdn.net/zhangphil/article/details/43700807 ），但写的过于紧耦合，不便于复用。现在大规模重新整理重写了项目部分代码，便于以后再工程中复用。

主要重写了几个方法，供以后使用重写：

protected Fragment getFragmentAt(int pos) {
		return null;
	}

	protected View getIndicatorAt(int pos) {
		return null;
	}

	protected int getItemsCount() {
		return 0;
	}

其中：

protected Fragment getFragmentAt(int pos) {
		return null;
	}

是ViewPager中每个单独的Page（该Page加载的Fragment）

相应的，一个Page（加载Fragment）对应一个下方Tab的选项卡：

protected View getIndicatorAt(int pos) {
		return null;
	}

以下是完整的项目代码：

重新命名该ViewPager+Fragment实现的“Tabhost”为 ViewPagerTabHost。

ViewPagerTabHost.java代码：

package zhangphil.libs.view;

import zhangphil.libs.R;
import android.graphics.Color;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;

public class ViewPagerTabHost extends Fragment {

	private MyFragmentPagerAdapter mPagerAdapter;
	private ViewPager mViewPager;
	private LinearLayout mLinearLayout;

	protected Fragment getFragmentAt(int pos) {
		return null;
	}

	protected View getIndicatorAt(int pos) {
		return null;
	}

	protected int getItemsCount() {
		return 0;
	}

	public void notifyDataSetChanged() {
		mPagerAdapter.notifyDataSetChanged();
	}

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View mView = inflater.inflate(R.layout.viewpager_tabhost, null);

		mViewPager = (ViewPager) mView.findViewById(R.id.viewpager);

		mLinearLayout = (LinearLayout) mView
				.findViewById(R.id.indicator_LinearLayout);
		addIndicators();
		// 初始化，第一项被选中
		setIndicatorViewSelected(0);

		mPagerAdapter = new MyFragmentPagerAdapter(getFragmentManager());
		mViewPager.setAdapter(mPagerAdapter);
		mViewPager
				.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

					@Override
					public void onPageSelected(int pos) {
						setIndicatorViewSelected(pos);
					}

					@Override
					public void onPageScrolled(int arg0, float arg1, int arg2) {

					}

					@Override
					public void onPageScrollStateChanged(int arg0) {

					}
				});

		return mView;
	}

	private void addIndicators() {
		// 添加Tab选项卡
		for (int i = 0; i < getItemsCount(); i++) {
			View v = getIndicatorAt(i);
			addIndicatorItem(v, i);
		}
	}

	private void addIndicatorItem(View view, final int index) {
		LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT,
				LayoutParams.MATCH_PARENT, 1);
		mLinearLayout.addView(view, index, params);
		view.setOnClickListener(new View.OnClickListener() {

			@Override
			public void onClick(View v) {
				set(index);
			}
		});
	}

	// 在这里设置被选中时候选项卡变化的效果
	private void setIndicatorViewSelected(int pos) {
		for (int i = 0; i < mLinearLayout.getChildCount(); i++) {

			if (i == pos) {
				View v = mLinearLayout.getChildAt(i);
				v.setBackgroundColor(Color.RED);
			} else {
				View v = mLinearLayout.getChildAt(i);
				v.setBackgroundColor(Color.GRAY);
			}
		}
	}

	private void set(int pos) {
		mViewPager.setCurrentItem(pos, true);
		setIndicatorViewSelected(pos);
	}

	private class MyFragmentPagerAdapter extends FragmentPagerAdapter {

		public MyFragmentPagerAdapter(FragmentManager fm) {
			super(fm);
		}

		@Override
		public Fragment getItem(int pos) {
			return getFragmentAt(pos);
		}

		@Override
		public int getCount() {
			return getItemsCount();
		}

		@Override
		public void notifyDataSetChanged() {
			super.notifyDataSetChanged();
			// addIndicators();
		}
	}
}

需要的布局文件 viewpager_tabhost.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"
    >
    
    
   <FrameLayout 
    android:layout_weight="1"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</FrameLayout>
   
   

    <LinearLayout
        android:id="@+id/indicator_LinearLayout"
        android:layout_width="match_parent"
        android:layout_height="50dip"
        android:orientation="horizontal" >
    </LinearLayout>

     
</LinearLayout>

viewpager_tabhost.xml可以在以后的实际项目中再次定制。