Android开发之漫漫长途 XIII——Fragment最佳实践
作者：忘了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
此致，敬礼