Android使用Fragment來實現ViewPager的功能（解決切換Fragment狀態不保存）以及各個Fragment之間的通信

以下內容為原創，轉載請注明：http://www.cnblogs.com/tiantianbyconan/p/3364728.html

我前兩天寫過一篇博客《Android使用Fragment來實現TabHost的功能（解決切換Fragment狀態不保存）以及各個Fragment之間的通信》（http://www.cnblogs.com/tiantianbyconan/p/3360938.html），實現了Tab切換時保留當前Fragment狀態，並在切換前自動回調onPause()方法，在切換后自動調用onResume()，這樣就做到了跟TahHost一樣的功能。

今天來實現下ViewPager的功能，google提供了一個FragmentPagerAdapter這么一個適配器，蛋疼的是，碰到了跟上次類似的問題。比如ViewPager有5個page，剛打開的時候，會加載page1和page2，我們手動切換到page2的時候，會加載page3，切換到page3的時候，加載page4的同時會destory掉page1，所以，還是面臨同樣的問題，page的狀態無法保存，於是，咱還是自己來實現下好了，自己動手，豐衣足食嘛！（同樣 有朋友知道解決辦法的話，希望聯系我，賜教下哈）

先來看下整個demo的結構，跟上次實現TabHost的例子差不多：

TabAFm到TabEFm都是Fragment，並且每個Fragment對應一個布局文件。

TabAFm.java：

 

package com.wangjie.fragmentviewpagertest;

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

/**
 * Created with IntelliJ IDEA.
 * Author: wangjie  email:[e-mail]
 * Date: 13-6-14
 * Time: 下午2:39
 */
public class TabAFm extends Fragment{
    @Override
    public void onAttach(Activity activity) {
        super.onAttach(activity);
        System.out.println("AAAAAAAAAA____onAttach");
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        System.out.println("AAAAAAAAAA____onCreate");
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        System.out.println("AAAAAAAAAA____onCreateView");
        return inflater.inflate(R.layout.tab_a, container, false);
    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        System.out.println("AAAAAAAAAA____onActivityCreated");
    }

    @Override
    public void onStart() {
        super.onStart();
        System.out.println("AAAAAAAAAA____onStart");
    }

    @Override
    public void onResume() {
        super.onResume();
        System.out.println("AAAAAAAAAA____onResume");
    }

    @Override
    public void onPause() {
        super.onPause();
        System.out.println("AAAAAAAAAA____onPause");
    }

    @Override
    public void onStop() {
        super.onStop();
        System.out.println("AAAAAAAAAA____onStop");
    }

    @Override
    public void onDestroyView() {
        super.onDestroyView();
        System.out.println("AAAAAAAAAA____onDestroyView");
    }

    @Override
    public void onDestroy() {
        super.onDestroy();
        System.out.println("AAAAAAAAAA____onDestroy");
    }

    @Override
    public void onDetach() {
        super.onDetach();
        System.out.println("AAAAAAAAAA____onDetach");
    }
}

如上述代碼所示，TabAFm是一個Fragment，對應的布局文件是tab_a.xml，並實現了他的所有的生命周期回調函數並打印，便於調試

tab_a.xml布局中有個EditText

其他的Fragment大同小異，這里就不貼出代碼了

 

現在來看MainActivity：

package com.wangjie.fragmentviewpagertest;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends FragmentActivity {
    private ViewPager viewPager;
    public List<Fragment> fragments = new ArrayList<Fragment>();
    public String hello = "hello ";

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        fragments.add(new TabAFm());
        fragments.add(new TabBFm());
        fragments.add(new TabCFm());
        fragments.add(new TabDFm());
        fragments.add(new TabEFm());

        viewPager = (ViewPager) findViewById(R.id.viewPager);
        FragmentViewPagerAdapter adapter = new FragmentViewPagerAdapter(this.getSupportFragmentManager(), viewPager,fragments);
        adapter.setOnExtraPageChangeListener(new FragmentViewPagerAdapter.OnExtraPageChangeListener(){
            @Override
            public void onExtraPageSelected(int i) {
                System.out.println("Extra...i: " + i);
            }
        });

    }

}

MainActivity上述代碼所示

MainActivity是包含Fragment的Activity（也就是這里的5個Fragment）

他繼承了FragmentActivity（因為我這里用的是android-support-v4.jar）

用一個List<Fragment>去維護5個Fragment，也就是5個page。

MainActivity的布局很簡單，就一個ViewPager，main.xml如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
        >
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />

</LinearLayout>

 

現在回到MainActivity中，下面這個FragmentViewPagerAdapter類是關鍵，是我自己編寫的用於綁定和處理fragments和ViewPager之間的邏輯關系

FragmentViewPagerAdapter adapter = new FragmentViewPagerAdapter(this.getSupportFragmentManager(), viewPager,fragments);

 

現在看下FragmentViewPagerAdapter：

package com.wangjie.fragmentviewpagertest;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.view.ViewGroup;

import java.util.List;

/**
 * 為ViewPager添加布局（Fragment），綁定和處理fragments和viewpager之間的邏輯關系
 *
 * Created with IntelliJ IDEA.
 * Author: wangjie  email:[e-mail]
 * Date: 13-10-11
 * Time: 下午3:03
 */
public class FragmentViewPagerAdapter extends PagerAdapter implements ViewPager.OnPageChangeListener{
    private List<Fragment> fragments; // 每個Fragment對應一個Page
    private FragmentManager fragmentManager;
    private ViewPager viewPager; // viewPager對象
    private int currentPageIndex = 0; // 當前page索引（切換之前）

    private OnExtraPageChangeListener onExtraPageChangeListener; // ViewPager切換頁面時的額外功能添加接口

    public FragmentViewPagerAdapter(FragmentManager fragmentManager, ViewPager viewPager , List<Fragment> fragments) {
        this.fragments = fragments;
        this.fragmentManager = fragmentManager;
        this.viewPager = viewPager;
        this.viewPager.setAdapter(this);
        this.viewPager.setOnPageChangeListener(this);
    }

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

    @Override
    public boolean isViewFromObject(View view, Object o) {
        return view == o;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView(fragments.get(position).getView()); // 移出viewpager兩邊之外的page布局
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        Fragment fragment = fragments.get(position);
        if(!fragment.isAdded()){ // 如果fragment還沒有added
            FragmentTransaction ft = fragmentManager.beginTransaction();
            ft.add(fragment, fragment.getClass().getSimpleName());
            ft.commit();
            /**
             * 在用FragmentTransaction.commit()方法提交FragmentTransaction對象后
             * 會在進程的主線程中，用異步的方式來執行。
             * 如果想要立即執行這個等待中的操作，就要調用這個方法（只能在主線程中調用）。
             * 要注意的是，所有的回調和相關的行為都會在這個調用中被執行完成，因此要仔細確認這個方法的調用位置。
             */
            fragmentManager.executePendingTransactions();
        }

        if(fragment.getView().getParent() == null){
            container.addView(fragment.getView()); // 為viewpager增加布局
        }

        return fragment.getView();
    }

    /**
     * 當前page索引（切換之前）
     * @return
     */
    public int getCurrentPageIndex() {
        return currentPageIndex;
    }

    public OnExtraPageChangeListener getOnExtraPageChangeListener() {
        return onExtraPageChangeListener;
    }

    /**
     * 設置頁面切換額外功能監聽器
     * @param onExtraPageChangeListener
     */
    public void setOnExtraPageChangeListener(OnExtraPageChangeListener onExtraPageChangeListener) {
        this.onExtraPageChangeListener = onExtraPageChangeListener;
    }

    @Override
    public void onPageScrolled(int i, float v, int i2) {
        if(null != onExtraPageChangeListener){ // 如果設置了額外功能接口
            onExtraPageChangeListener.onExtraPageScrolled(i, v, i2);
        }
    }

    @Override
    public void onPageSelected(int i) {
        fragments.get(currentPageIndex).onPause(); // 調用切換前Fargment的onPause()
//        fragments.get(currentPageIndex).onStop(); // 調用切換前Fargment的onStop()
        if(fragments.get(i).isAdded()){
//            fragments.get(i).onStart(); // 調用切換后Fargment的onStart()
            fragments.get(i).onResume(); // 調用切換后Fargment的onResume()
        }
        currentPageIndex = i;

        if(null != onExtraPageChangeListener){ // 如果設置了額外功能接口
            onExtraPageChangeListener.onExtraPageSelected(i);
        }

    }

    @Override
    public void onPageScrollStateChanged(int i) {
        if(null != onExtraPageChangeListener){ // 如果設置了額外功能接口
            onExtraPageChangeListener.onExtraPageScrollStateChanged(i);
        }
    }


    /**
     * page切換額外功能接口
     */
    static class OnExtraPageChangeListener{
        public void onExtraPageScrolled(int i, float v, int i2){}
        public void onExtraPageSelected(int i){}
        public void onExtraPageScrollStateChanged(int i){}
    }


}

這里解決Fragment切換重新加載布局的辦法，用的是把幾個Fragment全部Add，然后根據要顯示的哪個Fragment就把哪個Fragment的View給添加到“ViewGroup container”上去。

效果輸出：

// 以下打開程序后，加載PageA和PageB

10-12 09:42:46.671: INFO/System.out(27248): AAAAAAAAAA____onAttach
10-12 09:42:46.671: INFO/System.out(27248): AAAAAAAAAA____onCreate
10-12 09:42:46.671: INFO/System.out(27248): AAAAAAAAAA____onCreateView
10-12 09:42:46.761: INFO/System.out(27248): AAAAAAAAAA____onActivityCreated
10-12 09:42:46.765: INFO/System.out(27248): AAAAAAAAAA____onStart
10-12 09:42:46.765: INFO/System.out(27248): AAAAAAAAAA____onResume
10-12 09:42:46.847: INFO/System.out(27248): BBBBBBBBBBB____onAttach
10-12 09:42:46.847: INFO/System.out(27248): BBBBBBBBBBB____onCreate
10-12 09:42:46.851: INFO/System.out(27248): BBBBBBBBBBB____onCreateView
10-12 09:42:46.867: INFO/System.out(27248): BBBBBBBBBBB____onActivityCreated
10-12 09:42:46.867: INFO/System.out(27248): BBBBBBBBBBB____onStart
10-12 09:42:46.867: INFO/System.out(27248): BBBBBBBBBBB____onResume

// 以下切換到PageB

10-12 09:42:57.285: INFO/System.out(27248): AAAAAAAAAA____onPause　　　　// 切換到PageB前會調用PageA的onPause()方法
10-12 09:42:57.285: INFO/System.out(27248): BBBBBBBBBBB____onResume　　// 切換到PageB后會調用PageB的onResume()方法
10-12 09:42:57.285: INFO/System.out(27248): Extra...i: 1　　　　　　　　　　　　// 切換頁面時會調用切換額外功能接口（用戶可以自己寫需要的邏輯）
10-12 09:42:57.582: INFO/System.out(27248): CCCCCCCCCC____onAttach　　　　// 切換到PageB后會加載PageC
10-12 09:42:57.586: INFO/System.out(27248): CCCCCCCCCC____onCreate
10-12 09:42:57.586: INFO/System.out(27248): CCCCCCCCCC____onCreateView
10-12 09:42:57.675: INFO/System.out(27248): CCCCCCCCCC____onActivityCreated
10-12 09:42:57.675: INFO/System.out(27248): CCCCCCCCCC____onStart
10-12 09:42:57.675: INFO/System.out(27248): CCCCCCCCCC____onResume

// 以下切換到PageC

10-12 09:43:18.261: INFO/System.out(27248): BBBBBBBBBBB____onPause 　　　　// 切換到PageC前會調用PageB的onPause()方法
10-12 09:43:18.261: INFO/System.out(27248): CCCCCCCCCC____onResume　　　　// 切換到PageC后會調用PageC的onResume()方法
10-12 09:43:18.261: INFO/System.out(27248): Extra...i: 2　　　　　　　　　　　　　　// 切換頁面時會調用切換額外功能接口（用戶可以自己寫需要的邏輯）
10-12 09:43:18.726: INFO/System.out(27248): DDDDDDDDD____onAttach　　　　　　// 切換到PageC后會加載PageD
10-12 09:43:18.726: INFO/System.out(27248): DDDDDDDDD____onCreate
10-12 09:43:18.726: INFO/System.out(27248): DDDDDDDDD____onCreateView
10-12 09:43:18.738: INFO/System.out(27248): DDDDDDDDD____onActivityCreated
10-12 09:43:18.738: INFO/System.out(27248): DDDDDDDDD____onStart
10-12 09:43:18.742: INFO/System.out(27248): DDDDDDDDD____onResume

// 以下切換到PageB
10-12 09:43:20.742: INFO/System.out(27248): CCCCCCCCCC____onPause　　　　　　// 切換到PageB前會調用PageC的onPause()方法
10-12 09:43:20.742: INFO/System.out(27248): BBBBBBBBBBB____onResume　　　　// 切換到PageB后會調用PageB的onResume()方法
10-12 09:43:20.746: INFO/System.out(27248): Extra...i: 1　　　　　　　　　　　　　　// 切換頁面時會調用切換額外功能接口（用戶可以自己寫需要的邏輯）

 

好了，到此為止，我們已經用Fragment實現了ViewPager的功能了，同樣，下面來看下各個Fragment之間的通信

現在的情況是TabAFm中有個EditText，TabBFm中有個Button，MainActivity中有個變量“hello”

要做的是，切換到A，輸入“I'm PageA”，切換到B，點擊Button后，Toast顯示“hello I'm PageA”

MainActivity中沒什么好說的，就一個hello變量：

public String hello = "hello ";

TabBFm中：

@Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        System.out.println("BBBBBBBBBBB____onActivityCreated");
        this.getView().findViewById(R.id.clickme).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 獲得綁定的FragmentActivity
                MainActivity activity = ((MainActivity)getActivity());
                // 獲得TabAFm的控件
                EditText editText = (EditText) activity.fragments.get(0).getView().findViewById(R.id.edit);

                Toast.makeText(activity, activity.hello + editText.getText(), Toast.LENGTH_SHORT).show();
            }
        });
    }

 

最終效果圖：

 

demo下載：http://pan.baidu.com/s/1stGQ7