Android开发之漫漫长途 XIII——Fragment最佳实践

 关注 code小生 ,每日一篇技术推送!

作者:忘了12138
地址:http://www.cnblogs.com/wangle12138/p/8385990.html

声明:本文是 忘了12138 原创投稿,转发等请联系原作者授权。

该文章是一个系列文章,是本人在Android开发的漫漫长途上的一点感想和记录,我会尽量按照先易后难的顺序进行编写该系列。该系列引用了《Android开发艺术探索》以及《深入理解Android 卷Ⅰ,Ⅱ,Ⅲ》中的相关知识,另外也借鉴了其他的优质博客,在此向各位大神表示感谢,膜拜!!!

前言

上一篇文章中详细分析了Fragment相关知识,那么作为“小Activity”,Fragment能做什么呢,如何使用Fragment得到最佳实践呢。Fragment的设计最初也许是为了大屏幕平板设备的需求,不过现在Fragment已经广泛运用到我们普通的手机设备上。下图是我们几乎在主流App中都能发现的一个功能。

熟悉Android的朋友一定都会知道,很简单嘛,使用TabHost就OK了!但是殊不知,TabHost并非是那么的简单,它的可扩展性非常的差,不能随意地定制Tab项显示的内容,而且运行还要依赖于ActivityGroup。ActivityGroup原本主要是用于为每一个TabHost的子项管理一个单独的Activity,但目前已经被废弃了。为什么呢?当然就是因为Fragment的出现了!

好了,下面我就来实现上图的效果,不过在开始之前,首先你必须已经了解Fragment的用法了,如果你对Fragment还比较陌生的话,建议先去阅读我前面的一篇文章Android开发之漫漫长途 XII——Fragment详解

先创建宿主Activity

新建BestFragmentActivity

    public class BestFragmentActivity extends AppCompatActivity {

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

       //下面是LuseenBottomNavigation的使用
       BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottomNavigation);

       BottomNavigationItem bottomNavigationItem = new BottomNavigationItem
               ("首页", ContextCompat.getColor(this, R.color.firstColor), R.mipmap.ic_account_balance_white_48dp);
       BottomNavigationItem bottomNavigationItem1 = new BottomNavigationItem
               ("分类", ContextCompat.getColor(this, R.color.secondColor), R.mipmap.ic_list_white_48dp);

       BottomNavigationItem bottomNavigationItem2 = new BottomNavigationItem
               ("任务", ContextCompat.getColor(this, R.color.firstColor), R.mipmap.ic_add_circle_outline_white_48dp);
       BottomNavigationItem bottomNavigationItem3 = new BottomNavigationItem
               ("购物车", ContextCompat.getColor(this, R.color.thirdColor), R.mipmap.ic_add_shopping_cart_white_48dp);

       BottomNavigationItem bottomNavigationItem4 = new BottomNavigationItem
               ("我的", ContextCompat.getColor(this, R.color.colorAccent), R.mipmap.ic_account_box_white_48dp);

       bottomNavigationView.addTab(bottomNavigationItem);
       bottomNavigationView.addTab(bottomNavigationItem1);
       bottomNavigationView.addTab(bottomNavigationItem2);
       bottomNavigationView.addTab(bottomNavigationItem3);
       bottomNavigationView.addTab(bottomNavigationItem4);
       }

   }

对应的布局文件activity_best_fragment

    <?xml version="1.0" encoding="utf-8"?>
   <RelativeLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       xmlns:app="http://schemas.android.com/apk/res-auto"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:id="@+id/main_content"
       android:fitsSystemWindows="true"
       >


       <!--Fragment之后就动态的放在该布局文件下-->
       <FrameLayout
           android:id="@+id/frame_content"
           android:layout_width="match_parent"
           android:layout_height="match_parent"
           android:scrollbars="none"
           android:layout_above="@+id/bottomNavigation"
           />


       <!--关于底层布局我这里使用了Github上的开源项目-->
       <com.luseen.luseenbottomnavigation.BottomNavigation.BottomNavigationView
           android:id="@+id/bottomNavigation"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"

           android:layout_alignParentBottom="true"
           app:bnv_colored_background="false"
           app:bnv_with_text="true"
           app:bnv_shadow="false"
           app:bnv_tablet="false"
           app:bnv_viewpager_slide="true"
           app:bnv_active_color="@color/colorPrimary"
           app:bnv_active_text_size="@dimen/bottom_navigation_text_size_active"
           app:bnv_inactive_text_size="@dimen/bottom_navigation_text_size_inactive"/>


   </RelativeLayout>

关于底层布局我这里使用了Github上的开源项目LuseenBottomNavigation,该项目地址是https://github.com/armcha/LuseenBottomNavigation读者可自行查看

接着创建Fragment

目前Fragment作为演示使用,可以看到布局内容都非常简单,我这里只给出其中一个Fragment的创建过程和源码,项目完整源码可见文末的源码地址。

我们就拿第一个GoodsFragment举例把

    public class GoodsFragment extends Fragment {
       private static String TAG= GoodsFragment.class.getSimpleName();
       @Override
       public void onAttach(Context context) {
           super.onAttach(context);
           Log.d(TAG,"onAttach");
       }

       @Nullable
       @Override
       public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
           Log.d(TAG,"onCreateView");
           View view = inflater.inflate(R.layout.fragment_goods, null);
           return view;
       }

       @Override
       public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
           super.onViewCreated(view, savedInstanceState);
           Log.d(TAG,"onViewCreated");
       }

       @Override
       public void onActivityCreated(@Nullable Bundle savedInstanceState) {
           super.onActivityCreated(savedInstanceState);
           Log.d(TAG,"onActivityCreated");
       }

       @Override
       public void onCreate(@Nullable Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           Log.d(TAG,"onCreate");
       }

       @Override
       public void onStart() {
           super.onStart();
           Log.d(TAG,"onStart");
       }

       @Override
       public void onResume() {
           super.onResume();
           Log.d(TAG,"onResume");
       }

       @Override
       public void onPause() {
           super.onPause();
           Log.d(TAG,"onPause");
       }

       @Override
       public void onStop() {
           super.onStop();
           Log.d(TAG,"onStop");
       }

       @Override
       public void onDestroyView() {
           super.onDestroyView();
           Log.d(TAG,"onDestroyView");
       }

       @Override
       public void onDestroy() {
           super.onDestroy();
           Log.d(TAG,"onDestroy");
       }

       @Override
       public void onDetach() {
           super.onDetach();
           Log.d(TAG,"onDetach");
       }

   }

源码非常的简单,在onCreateView中加载布局文件,该布局文件也非常简单,仅仅定义了一个帧布局,在帧布局中包含了一个TextView

    <?xml version="1.0" encoding="utf-8"?>

   <FrameLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       android:layout_width="match_parent"
       android:layout_height="match_parent">


       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="Goods"
           android:textStyle="bold"
           android:textSize="30sp"
           android:layout_gravity="center"/>


   </FrameLayout>

按照上面的流程我们建立了所需的Fragment,接着该更改BestFragmentActivity的代码,更改后的源码如下

    public class BestFragmentActivity extends AppCompatActivity{
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_best_fragment);
           //底部导航布局
           BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottomNavigation);

           BottomNavigationItem bottomNavigationItem = new BottomNavigationItem
                   ("首页", ContextCompat.getColor(this, R.color.firstColor), R.mipmap.ic_account_balance_white_48dp);
           BottomNavigationItem bottomNavigationItem1 = new BottomNavigationItem
                   ("分类", ContextCompat.getColor(this, R.color.secondColor), R.mipmap.ic_list_white_48dp);

           BottomNavigationItem bottomNavigationItem2 = new BottomNavigationItem
                   ("任务", ContextCompat.getColor(this, R.color.firstColor), R.mipmap.ic_add_circle_outline_white_48dp);
           BottomNavigationItem bottomNavigationItem3 = new BottomNavigationItem
                   ("购物车", ContextCompat.getColor(this, R.color.thirdColor), R.mipmap.ic_add_shopping_cart_white_48dp);

           BottomNavigationItem bottomNavigationItem4 = new BottomNavigationItem
                   ("我的", ContextCompat.getColor(this, R.color.colorAccent), R.mipmap.ic_account_box_white_48dp);

           bottomNavigationView.addTab(bottomNavigationItem);
           bottomNavigationView.addTab(bottomNavigationItem1);
           bottomNavigationView.addTab(bottomNavigationItem2);
           bottomNavigationView.addTab(bottomNavigationItem3);
           bottomNavigationView.addTab(bottomNavigationItem4);

           //为底部导航布局设置点击事件
           bottomNavigationView.setOnBottomNavigationItemClickListener(new OnBottomNavigationItemClickListener() {
               @Override
               public void onNavigationItemClick(int i) {
                   switch (i){
                       case 0:
                           switchToHome();
                           break;
                       case 1:
                           switchToCategory();
                           break;
                       case 2:
                           switchToTask();
                           break;
                       case 3:
                           switchToGoodCar();
                           break;
                       case 4:
                           switchToAbout();
                           break;
                   }
               }
           });

           //初始加载首页,即GoodsFragment
           switchToHome();
       }

       private void switchToAbout() {
           getSupportFragmentManager().beginTransaction().replace(R.id.frame_content,new AboutFragment(),AboutFragment.class.getName()).commit();
       }
       private void switchToCategory() {
           getSupportFragmentManager().beginTransaction().replace(R.id.frame_content,new CategoryFragment(),CategoryFragment.class.getName()).commit();
       }

       private void switchToTask() {
           getSupportFragmentManager().beginTransaction().replace(R.id.frame_content,new TaskFragment(),TaskFragment.class.getName()).commit();
       }

       private void switchToGoodCar() {
           getSupportFragmentManager().beginTransaction().replace(R.id.frame_content,new GoodCarFragment(),GoodCarFragment.class.getName()).commit();
       }

       private void switchToHome() {
           getSupportFragmentManager().beginTransaction().replace(R.id.frame_content,new GoodsFragment(),GoodsFragment.class.getName()).commit();
       }
   }

上面的代码可以根据上一篇文章比较容易的写出来,而且正常运行,可是在实际开发过程中我们不得不考虑代码的性能问题。其实上面的代码存在性能问题,尤其是在底部导航这种场景中,Fragment之间的来回切换,这里使用的replace方法。关于这个方法带来的问题以及如何进行优化,将在下一节详细说明。

Fragment 性能优化问题

FragmentTransaction

谈到Fragment的性能优化问题,就不得不对FragmentTransaction进行深入的研究以及探讨,上面使用了getSupportFragmentManager().beginTransaction()得到了FragmentTransaction对象,并依次调用其replace方法和commit方法。

  • replace(int containerViewId, Fragment fragment)、replace(int containerViewId, Fragment fragment, String tag)

该方法的作用是,类似于先remove掉视图容器所有的Fragment,再add方法参数中的fragment,并为该Fragment设置标签tag。

        getSupportFragmentManager().beginTransaction().add(R.id.frame_content,new AboutFragment(),AboutFragment.class.getName()).commit();
       getSupportFragmentManager().beginTransaction().add(R.id.frame_content,new CategoryFragment(),CategoryFragment.class.getName()).commit();
       getSupportFragmentManager().beginTransaction().add(R.id.frame_content,new TaskFragment(),TaskFragment.class.getName()).commit();
       getSupportFragmentManager().beginTransaction().replace(R.id.frame_content,new GoodsFragment(),GoodsFragment.class.getName()).commit();

如上面所示代码块中,我们先进行了3次添加操作,之后的replace操作会移出前面添加的Fragment,再添加方法参数中指定的Frament。

  • add(int containerViewId, Fragment fragment, String tag)、 remove(Fragment fragment)
    FragmentTransaction的Add()操作是维持着一个队列的,在这个队列中,根据ADD进去的先后顺序形成了一个链表,我们上面的操作在这个列表中的形式变化如下图所示:

  • remove(Fragment fragment) : 移除一个已经存在的Fragment.

  • show(Fragment fragment): 显示一个以前被隐藏过的Fragment

  • hide(Fragment fragment) : 隐藏一个存在的Fragment

    注:①Fragment被hide/show,仅仅是隐藏/显示Fragment的视图,不会有任何生命周期方法的调用。

    ②在Fragment中重写onHiddenChanged方法可以对Fragment的hide和show状态进行监听。

还有一些其他的方法这里就不一一列举了,有了上面所列出的方法,我们就能对Fragment有个很不错的优化了。

Fragment性能问题分析与解决

Fragment性能问题分析

我们上面是使用replace来切换页面,那么在每次切换的时候,Fragment都会重新实例化,重新加载一边数据,这样非常消耗性能和用户的数据流量。这是因为replace操作,每次都会把container中的现有的fragment实例清空,然后再把指定的fragment添加进去,就就造成了在切换到以前的fragment时,就会重新实例会fragment。

Fragment性能问题解决

知道了问题的根源所在,那么解决的办法也呼之欲出了。我们不能使用replace来进行页面的切换,那么可使用的方法貌似只有add了,我们可以在加载的时候判断Fragment是不是已经被添加到队列中,如果已添加,我们就显示(show)该Fragment,隐藏(hide)其他,如果没有添加过呢,就添加。这样就能做到多个Fragment切换不重新实例化。具体到代码中就是这样的

    public class BestFragmentActivity extends AppCompatActivity{

       //当前的Fragment
       private Fragment mCurFragment = new Fragment();
       //初始化其他的Fragment
       private GoodsFragment mGoodsFragment = new GoodsFragment();
       private GoodCarFragment mGoodCarFragment = new GoodCarFragment();
       private TaskFragment mTaskFragment = new TaskFragment();
       private AboutFragment mAboutFragment  = new AboutFragment();
       private CategoryFragment mCategoryFragment  = new CategoryFragment();

       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_best_fragment);
           BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottomNavigation);

           BottomNavigationItem bottomNavigationItem = new BottomNavigationItem
                   ("首页", ContextCompat.getColor(this, R.color.firstColor), R.mipmap.ic_account_balance_white_48dp);
           BottomNavigationItem bottomNavigationItem1 = new BottomNavigationItem
                   ("分类", ContextCompat.getColor(this, R.color.secondColor), R.mipmap.ic_list_white_48dp);

           BottomNavigationItem bottomNavigationItem2 = new BottomNavigationItem
                   ("任务", ContextCompat.getColor(this, R.color.firstColor), R.mipmap.ic_add_circle_outline_white_48dp);
           BottomNavigationItem bottomNavigationItem3 = new BottomNavigationItem
                   ("购物车", ContextCompat.getColor(this, R.color.thirdColor), R.mipmap.ic_add_shopping_cart_white_48dp);

           BottomNavigationItem bottomNavigationItem4 = new BottomNavigationItem
                   ("我的", ContextCompat.getColor(this, R.color.colorAccent), R.mipmap.ic_account_box_white_48dp);

           bottomNavigationView.addTab(bottomNavigationItem);
           bottomNavigationView.addTab(bottomNavigationItem1);
           bottomNavigationView.addTab(bottomNavigationItem2);
           bottomNavigationView.addTab(bottomNavigationItem3);
           bottomNavigationView.addTab(bottomNavigationItem4);

           bottomNavigationView.setOnBottomNavigationItemClickListener(new OnBottomNavigationItemClickListener() {
               @Override
               public void onNavigationItemClick(int i) {
                   switch (i){
                       case 0:
                           switchToHome();
                           break;
                       case 1:
                           switchToCategory();
                           break;
                       case 2:
                           switchToTask();
                           break;
                       case 3:
                           switchToGoodCar();
                           break;
                       case 4:
                           switchToAbout();
                           break;
                   }
               }
           });
           switchToHome();
       }

      private void switchFragment(Fragment targetFragment){
           FragmentTransaction transaction = getSupportFragmentManager()
                   .beginTransaction();
           if (!targetFragment.isAdded()) {//如果要显示的targetFragment没有添加过
               transaction
                       .hide(mCurFragment)//隐藏当前Fragment
                       .add(R.id.frame_content, targetFragment,targetFragment.getClass().getName())//添加targetFragment
                       .commit();
           } else {//如果要显示的targetFragment已经添加过
               transaction//隐藏当前Fragment
                       .hide(mCurFragment)
                       .show(targetFragment)//显示targetFragment
                       .commit();
           }
           //更新当前Fragment为targetFragment
           mCurFragment = targetFragment;

       }

       private void switchToAbout() {
           switchFragment(mAboutFragment);
       }
       private void switchToCategory() {
           switchFragment(mCategoryFragment);
       }
       private void switchToTask() {
           switchFragment(mTaskFragment);
       }
       private void switchToGoodCar() {
           switchFragment(mGoodCarFragment);
       }
       private void switchToHome() {
           switchFragment(mGoodsFragment);
       }

   }

这样就达到了我们的目的,我们在来回切换的操作中,Fragment只实例一次,少了销毁又重新创建等带来的性能消耗,另我们想要在Fragment中更新数据时,我们可以在自定义Fragment中重写其onHiddenChanged方法

    @Override
   public void onHiddenChanged(boolean hidden) {
       super.onHiddenChanged(hidden);
       if (hidden){
          //Fragment隐藏时调用
       }else {
           //Fragment显示时调用
       }

   }

源码地址:源码传送门

本篇总结

我们在本篇博客中比较详细的给出了一个Fragment的最佳实践,我们在许多主流App中都能看到这种顶部、底部导航的效果,并且在此基础上我们探讨了使用Fragment不当的存在性能问题及优化。

下篇预告

下篇打算往Fragment中加点东西,ListView

此致,敬礼


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值