Android FragmentTabhost实现选项卡

在Android3.0之后，google创造了Fragment，因此原来的Tabhost已经不推荐使用了，现在一般推荐使用FragmentTabhost。

google考虑到了兼容问题，因此FragmentTabhost并未加在官方的SDK中，而是把它放在了android-support-v4.jar中

下面我带大家来实现一下这个功能。

1、MyFragmentTabhostActivity.java

public class MyFragmentTabhostActivity extends FragmentActivity {

	private Context context;
	private FragmentTabHost fragmentTabHost = null;
	private Class[] fragmentArray = { MyFragment.class, MyFragment.class, MyFragment.class, MyFragment.class };
	private int[] tabImageArray = { R.drawable.ic_launcher, R.drawable.ic_launcher, R.drawable.ic_launcher, R.drawable.ic_launcher };
	private String[] tabTextArray = { "广场", "排名", "商城", "我" };

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_fragmenttabhost);
		context = this;
		initView();
	}

	private void initView() {
		LayoutInflater inflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
		fragmentTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
		fragmentTabHost.setup(context, getSupportFragmentManager(), R.id.real_tabcontent);
		for (int i = 0; i < fragmentArray.length; i++) {
			// 给每个Tab按钮设置图标、文字和内容
			TabSpec tabSpec = fragmentTabHost.newTabSpec(tabTextArray[i]).setIndicator(getTabItemView(inflater, i));
			fragmentTabHost.addTab(tabSpec, fragmentArray[i], null);
			// 设置Tab按钮的背景
			fragmentTabHost.getTabWidget().getChildAt(i).setBackgroundColor(Color.rgb((int)(Math.random()*255), (int)(Math.random()*255), (int)(Math.random()*255)));
		}
	}

	public View getTabItemView(LayoutInflater inflater, int index) {
		View view = inflater.inflate(R.layout.item_tab, null);
		ImageView imageView = (ImageView) view.findViewById(R.id.imageview);
		TextView textView = (TextView) view.findViewById(R.id.textview);
		imageView.setImageResource(tabImageArray[index]);
		textView.setText(tabTextArray[index]);
		return view;
	}
}
           

2、Fragment.java

public class MyFragment extends Fragment {

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
		View view = inflater.inflate(R.layout.layout_fragment, null);
		view.setBackgroundColor(Color.rgb((int)(Math.random()*255), (int)(Math.random()*255), (int)(Math.random()*255)));
		return view;
	}
}
           

3、activity_fragment.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:id="@+id/real_tabcontent"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_weight="0" >

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp"/>
    </android.support.v4.app.FragmentTabHost>

</LinearLayout>
           

4、item_tab.xml

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

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:gravity="center_horizontal"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/imageview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_launcher" />

        <TextView
            android:id="@+id/textview"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="" />
    </LinearLayout>

</RelativeLayout>
           

5、layout_fragment.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>
           

6、运行截图