Fragment代替TabActivity和ActivityGroup

本篇文章屬於架構重構。由於Android很早就廢棄了TabActivity,但是我們的項目還在使用,所以要將他替換掉。

項目地址:https://github.com/jiahongfei/UITabDemo

TabActivity廢棄

當前公司的App使用的UI Tab架構還是很老的TabActivity+TabHost+Activity形式,這是個歷史遺留問題,也不去糾結當時爲什麼要這麼做,現在要做的就是將他替換掉。否則如果Android去修改TabActivity的源碼造成App不能使用肯定是後果自負,已經通知廢棄這個類了。如下截圖:


Android官方文檔寫的非常詳細,API13已經廢棄了,新的app應該使用Fragment來代替。

Fragment代替

重構App UI Tab框架非常危險,因爲牽扯的東西非常多。所以重構之前需要仔細想好如下幾點在開始寫代碼。

  1. 儘量少的修改代碼,選擇工作近似的類來進行替換。
  2. 特別需要注意生命週期的回調,切換Tab、跳轉、返回等生命週期的回調方式。
  3. 需要注意父類擴展的方法。
  4. 儘量增加代碼,減少修改代碼。

1. 儘量少的修改代碼,選擇工作近似的類來進行替換。

我們先觀察老代碼是什麼樣的,如下代碼片段:
代碼片段都是我寫的demo,真實的app項目要複雜的多,但是在demo上我會把重構需要注意的點都提現出來。

MainActivity.java
public class MainActivity extends TabActivity {
    private TabHost tabHost;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        tabHost = getTabHost();
        TabHost.TabSpec tabSpec1 = tabHost
                .newTabSpec(AActivity.class.getSimpleName())
                .setIndicator(AActivity.class.getSimpleName())
                .setContent(new Intent(this, AActivity.class));
        tabHost.addTab(tabSpec1);

        TabHost.TabSpec tabSpec2 = tabHost
                .newTabSpec(BActivity.class.getSimpleName())
                .setIndicator(BActivity.class.getSimpleName())
                .setContent(new Intent(this, BActivity.class));
        tabHost.addTab(tabSpec2);

        findViewById(R.id.btn_1).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tabHost.setCurrentTab(0);
            }
        });

        findViewById(R.id.btn_2).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tabHost.setCurrentTab(1);

            }
        });
    }
}

activity_main.xml
<?xml version="1.0" encoding="UTF-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0.0dip"
            android:layout_weight="1.0" >
        </FrameLayout>

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.0"
            android:visibility="gone" />


        <RadioGroup
            android:id="@+id/main_radio"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:gravity="center_vertical"
            android:orientation="horizontal">

            <Button
                android:layout_weight="1"
                android:id="@+id/btn_1"
                android:text="btn_1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

            <Button
                android:layout_weight="1"
                android:id="@+id/btn_2"
                android:text="btn_2"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </RadioGroup>
    </LinearLayout>
</TabHost>

我們觀察老代碼使用TabActivity+TabHost+Activity
結合上面提出的第一點第二點,我們使用FragmentActivity+FragmentTabHost+Fragment來替換原來的架構,這也是Android官方文檔提倡的。
針對第一點FragmentTabHostTabHost的子類,所以原來老代碼使用TabHost地方的方法基本都可以用,例如切換Tab的方法tabHost.setCurrentTab(0);

我們先替換如下代碼片段:
不一樣的地方在代碼中註釋提現注意觀察

MainActivity.java
//將extends TabActiviy 修改成 FragmentActivity
public class MainActivity extends FragmentActivity {

    //將TabHost 修改成 FragmentTabHost
    private FragmentTabHost tabHost;

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

        //將tabHost = getTabHost();修改成如下方式獲取,並且調用tabHost.setup(xxxx);方法進行設置
        tabHost = findViewById(android.R.id.tabhost);
        tabHost.setup(this,getSupportFragmentManager(), android.R.id.tabcontent);

        //不需要設置tabSpec.setContent(xxxx);方法
        TabHost.TabSpec tabSpecA = tabHost
                .newTabSpec(AFragment.class.getSimpleName())
                .setIndicator(AFragment.class.getSimpleName());
        //tabHost.addTab(xxx);進行修改,增加Fragment.class,和Bundle參數
        tabHost.addTab(tabSpecA,AFragment.class,null);
        TabHost.TabSpec tabSpecB = tabHost
                .newTabSpec(BFragment.class.getSimpleName())
                .setIndicator(BFragment.class.getSimpleName());
        tabHost.addTab(tabSpecB, BFragment.class,null);

        //切換代碼沒有任何修改
        findViewById(R.id.btn_1).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tabHost.setCurrentTab(0);
            }
        });

        findViewById(R.id.btn_2).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                tabHost.setCurrentTab(1);
            }
        });
    }
}

activity_main.xml
<?xml version="1.0" encoding="UTF-8"?>
<!--將TabHost替換成FragmentTabHost-->
<android.support.v4.app.FragmentTabHost
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0.0dip"
            android:layout_weight="1.0" >
        </FrameLayout>

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.0"
            android:visibility="gone" />


        <RadioGroup
            android:id="@+id/main_radio"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:gravity="center_vertical"
            android:orientation="horizontal">

            <Button
                android:layout_weight="1"
                android:id="@+id/btn_1"
                android:text="btn_1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

            <Button
                android:layout_weight="1"
                android:id="@+id/btn_2"
                android:text="btn_2"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </RadioGroup>
    </LinearLayout>
</android.support.v4.app.FragmentTabHost>

如上代碼的註釋修改的地方非常的少,這就滿足了我們的第一點

2. 特別需要注意生命週期的回調,切換Tab、跳轉、返回等生命週期的回調方式。

針對第二點Fragment有着類似Activity的生命週期,所以只要讓新老代碼的生命週期回調方式一樣就可以。
下面我們來觀察生命週期的走向。
老代碼生命週期的走向如下:

//App啓動 A頁生命週期
02-23 15:47:37.392 12953-12953/com.andrjhf.ui.tab.demo E/AActivity: onCreate
02-23 15:47:37.392 12953-12953/com.andrjhf.ui.tab.demo E/AActivity: onStart
02-23 15:47:37.402 12953-12953/com.andrjhf.ui.tab.demo E/AActivity: onResume
//切換到B頁生命週期
02-23 15:48:10.102 12953-12953/com.andrjhf.ui.tab.demo E/AActivity: onPause
02-23 15:48:10.122 12953-12953/com.andrjhf.ui.tab.demo E/BActivity: onCreate
02-23 15:48:10.122 12953-12953/com.andrjhf.ui.tab.demo E/BActivity: onStart
02-23 15:48:10.122 12953-12953/com.andrjhf.ui.tab.demo E/BActivity: onResume
//切換回A頁生命週期
02-23 15:48:23.382 12953-12953/com.andrjhf.ui.tab.demo E/BActivity: onPause
02-23 15:48:23.382 12953-12953/com.andrjhf.ui.tab.demo E/AActivity: onResume

新代碼生命週期回調:

//App啓動 A頁生命週期
02-23 15:51:21.522 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onAttach
02-23 15:51:21.522 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onCreate
02-23 15:51:21.522 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onCreateView
02-23 15:51:21.522 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onActivityCreated
02-23 15:51:21.522 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onStart
02-23 15:51:21.522 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onResume
//切換到B頁生命週期
02-23 15:51:39.662 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onAttach
02-23 15:51:39.662 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onCreate
02-23 15:51:39.662 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onPause
02-23 15:51:39.662 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onStop
02-23 15:51:39.662 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onDestroyView
02-23 15:51:39.662 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onCreateView
02-23 15:51:39.672 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onActivityCreated
02-23 15:51:39.672 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onStart
02-23 15:51:39.672 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onResume
//切換回A頁生命週期
02-23 15:51:50.282 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onPause
02-23 15:51:50.282 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onStop
02-23 15:51:50.282 13378-13378/com.andrjhf.ui.tab.demo E/BFragment: onDestroyView
02-23 15:51:50.282 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onCreateView
02-23 15:51:50.282 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onActivityCreated
02-23 15:51:50.282 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onStart
02-23 15:51:50.282 13378-13378/com.andrjhf.ui.tab.demo E/AFragment: onResume

我們看差異,A、B頁來回切換,老代碼的生命週期只是onPauseonResume的方法進行切換。
而新代碼則不是,切換到B頁時AFragment會調用onDestroyView方法銷燬視圖,而切換回來A頁時會重新調用AFragmentonCreateView方法來重新加載視圖,和老代碼的生命週期不一樣。
尋找突破點,首先想到的就是負責切換的FragmentTabHost類,我們查看源碼,直接上重點如下代碼片段:

public class NotDestroyedFragmentTabHost extends FragmentTabHost {
    ......忽略
    @Nullable
    private FragmentTransaction doTabChanged(@Nullable String tag,
            @Nullable FragmentTransaction ft) {
        final TabInfo newTab = getTabInfoForTag(tag);
        if (mLastTab != newTab) {
            if (ft == null) {
                ft = mFragmentManager.beginTransaction();
            }

            if (mLastTab != null) {
                if (mLastTab.fragment != null) {
                    //重要代碼,表示加載過的Fragment切換時需要銷燬
                    //ft.detach(mLastTab.fragment);
                    //修改成如下代碼,由於ft.hide(xxx);方法只是回到了Fragment的onHiddenChanged方法所以我手動調用了fragment的生命週期方法
                    mLastTab.fragment.onPause();
                    mLastTab.fragment.onStop();
                    ft.hide(mLastTab.fragment);
                }
            }

            if (newTab != null) {
                if (newTab.fragment == null) {
                    newTab.fragment = Fragment.instantiate(mContext,
                            newTab.clss.getName(), newTab.args);
                    ft.add(mContainerId, newTab.fragment, newTab.tag);
                } else {
                    //重要代碼,表示已經添加過的Fragment展示的時候重新綁定
                    //ft.attach(newTab.fragment);
                    //修改成如下代碼,由於ft.show(xxx);方法只是回到了Fragment的onHiddenChanged方法所以我手動調用了fragment的生命週期方法
                    newTab.fragment.onStart();
                    newTab.fragment.onResume();
                    ft.show(newTab.fragment);
                }
            }

            mLastTab = newTab;
        }

        return ft;
    }
    ......忽略
}

修改完成之後將activity_main.xml中的TabHost替換成NotDestroyedFragmentTabHost之後再看生命週期打印信息:

//App啓動 A頁生命週期
02-23 16:09:39.412 15819-15819/? E/AFragment: onAttach
02-23 16:09:39.412 15819-15819/? E/AFragment: onCreate
02-23 16:09:39.422 15819-15819/? E/AFragment: onCreateView
02-23 16:09:39.422 15819-15819/? E/AFragment: onActivityCreated
02-23 16:09:39.422 15819-15819/? E/AFragment: onStart
02-23 16:09:39.422 15819-15819/? E/AFragment: onResume
//切換到B頁生命週期
02-23 16:09:53.772 15819-15819/com.andrjhf.ui.tab.demo E/AFragment: onPause
02-23 16:09:53.772 15819-15819/com.andrjhf.ui.tab.demo E/AFragment: onStop
02-23 16:09:53.782 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onAttach
02-23 16:09:53.782 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onCreate
02-23 16:09:53.782 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onCreateView
02-23 16:09:53.782 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onActivityCreated
02-23 16:09:53.782 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onStart
02-23 16:09:53.782 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onResume
//切換回A頁生命週期
02-23 16:10:01.062 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onPause
02-23 16:10:01.062 15819-15819/com.andrjhf.ui.tab.demo E/BFragment: onStop
02-23 16:10:01.062 15819-15819/com.andrjhf.ui.tab.demo E/AFragment: onStart
02-23 16:10:01.062 15819-15819/com.andrjhf.ui.tab.demo E/AFragment: onResume

如上A、B也的切換隻是onStart、onResumeonPause、onStop來回進行切換,達到了我們的目的。

3.需要注意父類擴展的方法。

第三點,如果之前Activity的父類是自己寫的例如BaseActiviy那麼Fragment也要自己寫父類BaseFragment去實現相應的方法。
在我真實項目的代碼中BaseActivity實現了EventBusButterKnife、登錄成功的回調等等。
BaseFragment中也要去相應的實現這些功能。
如下代碼示例:

BaseActivity.java
public abstract class BaseActivity extends Activity {
    private static final String TAG = BaseActivity.class.getSimpleName();

    protected Context mContext = null;
    private Unbinder unbinder;

    @Override
    public void onContentChanged() {
        super.onContentChanged();
        unbinder = ButterKnife.bind(this);
    }

    public <T extends View> T findById(int resId) {
        return ButterKnife.findById(this, resId);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mContext = this;
        requestWindowFeature(Window.FEATURE_NO_TITLE);

        EventBus.getDefault().register(this);

        PushUtil.init(mContext);
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();

        ToastUtil.getInstance(this).cancelToast();
        dismissPermissionDialog();

        EventBus.getDefault().unregister(this);
        HttpRequestUtil.cancelPendingRequests(this);
        if (unbinder != null) {
            unbinder.unbind();
            unbinder = null;
        }

    }

    protected void showLoadingView() {

    }
    
    protected void dismissLoadingView() {

    }

    public void onEventMainThread(Object event) {
        if (event instanceof OnLoginEvent) {
            Object result = ((OnLoginEvent) event).mMoInfoModel;
            onLoginCompleted(result);
        }
    }
    
    protected void onLoginCompleted(Object login) {
        Logger.d(TAG, "onLoginCompleted, result = " + login);
    }
   
}

BaseFragment.java
public abstract class BaseFragment extends cn.feng.skin.manager.base.BaseFragment {

    private static final String TAG = BaseActivity.class.getSimpleName();

    protected Activity mActivity;
    protected Context mContext;
    private Unbinder unbinder;

    @Override
    public void onAttach(Activity activity) {
        mActivity = activity;
        mContext = activity;
        super.onAttach(activity);
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        EventBus.getDefault().register(this);
    }

    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        unbinder = ButterKnife.bind(this, view);
    }

    @Override
    public void onDestroyView() {
        super.onDestroyView();
        ToastUtil.getInstance(mActivity).cancelToast();

        EventBus.getDefault().unregister(this);
        HttpRequestUtil.cancelPendingRequests(this);

        if (unbinder != null) {
            unbinder.unbind();
            unbinder = null;
        }
    }

    @Override
    public void onDestroy() {
        super.onDestroy();
        EventBus.getDefault().unregister(this);
    }

    protected void onLoginCompleted(Object login) {
        Logger.d(TAG, "onLoginCompleted, result = " + login);
    }

    public void onEventMainThread(Object event) {
        if (event instanceof OnLoginEvent) {
            Object result = ((OnLoginEvent) event).mMoInfoModel;
            onLoginCompleted(result);
        }
    }

    protected void showLoadingView() {
        
    }

    protected void dismissLoadingView() {
        
    }
}

4.儘量增加代碼,減少修改代碼。

第四點 :這個很簡單我們用Fragment替換Activity不要刪除Activity或者在原有代碼上修改,一定要新建一個Fragment文件進行修改保留當時Activity的代碼,用來進行後期比較。

總結:

對於這種重構一定要想清楚在修改,改完之後一定要進行嚴格的迴歸測試,把每個邏輯都測試到,避免留下bug。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章