實現在Android 2.2 + ViewPager和片段中使用TabHost的教程

Question

對於像我這樣的人來說，在尋找實現TabHost和ViewPager的方法時遇到了一些麻煩，包括使用手指滑動頁面和單擊頁面以更改頁面。顯示的解決方案與Android版本2.2+兼容。

它包括Tabs初始化，ViewPager與Tabs和Page Scrolling管理連接。

它的主要特點是針對早期版本的Android（FROYO，API版本8，Android 2.2）的優化以及針對不同目的的簡單實現。

我希望它會有用。

Answer 1

本教程包括4個課程和2個佈局。它已通過Android Phone 2.2測試，您可以複製&粘貼來嘗試。

本教程歡迎評論&改進！

MainActivity.java（主活性）：

package samples.tabhost.andreaoid.net; 

import java.util.ArrayList; 
import java.util.List; 
import android.os.Bundle; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentActivity; 
import android.support.v4.view.ViewPager; 
import android.support.v4.view.ViewPager.OnPageChangeListener; 
import android.widget.TabHost; 
import android.widget.TabHost.OnTabChangeListener; 

public class MainActivity extends FragmentActivity implements OnTabChangeListener, OnPageChangeListener { 

    MyPageAdapter pageAdapter; 
    private ViewPager mViewPager; 
    private TabHost mTabHost; 

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

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

     // Tab Initialization 
     initialiseTabHost(); 

     // Fragments and ViewPager Initialization 
     List<Fragment> fragments = getFragments(); 
     pageAdapter = new MyPageAdapter(getSupportFragmentManager(), fragments); 
     mViewPager.setAdapter(pageAdapter); 
     mViewPager.setOnPageChangeListener(MainActivity.this); 
    } 

    // Method to add a TabHost 
    private static void AddTab(MainActivity activity, TabHost tabHost, TabHost.TabSpec tabSpec) { 
     tabSpec.setContent(new MyTabFactory(activity)); 
     tabHost.addTab(tabSpec); 
    } 

    // Manages the Tab changes, synchronizing it with Pages 
    public void onTabChanged(String tag) { 
     int pos = this.mTabHost.getCurrentTab(); 
     this.mViewPager.setCurrentItem(pos); 
    } 

    @Override 
    public void onPageScrollStateChanged(int arg0) { 
    } 

    // Manages the Page changes, synchronizing it with Tabs 
    @Override 
    public void onPageScrolled(int arg0, float arg1, int arg2) { 
     int pos = this.mViewPager.getCurrentItem(); 
     this.mTabHost.setCurrentTab(pos); 
    } 

    @Override 
     public void onPageSelected(int arg0) { 
    } 

    private List<Fragment> getFragments(){ 
     List<Fragment> fList = new ArrayList<Fragment>(); 

     // TODO Put here your Fragments 
     MySampleFragment f1 = MySampleFragment.newInstance("Sample Fragment 1"); 
     MySampleFragment f2 = MySampleFragment.newInstance("Sample Fragment 2"); 
     MySampleFragment f3 = MySampleFragment.newInstance("Sample Fragment 3"); 
     fList.add(f1); 
     fList.add(f2); 
     fList.add(f3); 

     return fList; 
    } 

    // Tabs Creation 
    private void initialiseTabHost() { 
     mTabHost = (TabHost) findViewById(android.R.id.tabhost); 
     mTabHost.setup(); 

     // TODO Put here your Tabs 
     MainActivity.AddTab(this, this.mTabHost, this.mTabHost.newTabSpec("Tab1").setIndicator("Tab1")); 
     MainActivity.AddTab(this, this.mTabHost, this.mTabHost.newTabSpec("Tab2").setIndicator("Tab2")); 
     MainActivity.AddTab(this, this.mTabHost, this.mTabHost.newTabSpec("Tab3").setIndicator("Tab3")); 

     mTabHost.setOnTabChangedListener(this); 
    } 
} 

MyPageAdapter.java（片段管理器）：

package samples.tabhost.andreaoid.net; 

import java.util.List; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentManager; 
import android.support.v4.app.FragmentPagerAdapter; 

public class MyPageAdapter extends FragmentPagerAdapter { 
    private List<Fragment> fragments; 

    public MyPageAdapter(FragmentManager fm, List<Fragment> fragments) { 
     super(fm); 
     this.fragments = fragments; 
    } 

    @Override 
    public Fragment getItem(int position) { 
     return this.fragments.get(position); 
    } 

    @Override 
    public int getCount() { 
     return this.fragments.size(); 
    } 
} 

MyTabFactory（標籤管理器）：

package samples.tabhost.andreaoid.net; 

import android.content.Context; 
import android.view.View; 
import android.widget.TabHost.TabContentFactory; 

public class MyTabFactory implements TabContentFactory { 

    private final Context mContext; 

    public MyTabFactory(Context context) { 
     mContext = context; 
    } 

    public View createTabContent(String tag) { 
     View v = new View(mContext); 
     v.setMinimumWidth(0); 
     v.setMinimumHeight(0); 
     return v; 
    } 
} 

MySampleFragment.java（單片段 - 包括用於演示目的）：

package samples.tabhost.andreaoid.net; 

import android.os.Bundle; 
import android.support.v4.app.Fragment; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
import android.widget.TextView; 

public class MySampleFragment extends Fragment { 

    private static View mView; 

    public static final MySampleFragment newInstance(String sampleText) { 
     MySampleFragment f = new MySampleFragment(); 

     Bundle b = new Bundle(); 
     b.putString("bString", sampleText); 
     f.setArguments(b); 

    return f; 
    } 

    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { 

     mView = inflater.inflate(R.layout.sample_fragment, container, false); 
     String sampleText = getArguments().getString("bString"); 

     TextView txtSampleText = (TextView) mView.findViewById(R.id.txtViewSample); 
     txtSampleText.setText(sampleText); 

     return mView; 
    } 
} 

activity_main.xml中：

<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=".MainActivity" > 

    <TabHost 
     android:id="@android:id/tabhost" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" > 
     <LinearLayout 
      android:layout_width="fill_parent" 
      android:layout_height="wrap_content" 
      android:orientation="vertical" > 
      <TabWidget 
       android:id="@android:id/tabs" 
       android:orientation="horizontal" 
       android:layout_width="fill_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:layout_weight="0" /> 
      <android.support.v4.view.ViewPager 
       android:id="@+id/viewpager" 
       android:layout_width="fill_parent" 
       android:layout_height="wrap_content" 
       android:layout_gravity="bottom" /> 
     </LinearLayout> 
    </TabHost> 
</RelativeLayout> 

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

    <TextView 
     android:id="@+id/txtViewSample" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentLeft="true" 
     android:layout_alignParentRight="true" 
     android:layout_alignParentTop="true" 
     android:text="" /> 

</RelativeLayout>