[关闭]
@xujun94 2016-10-16T01:24:49.000000Z 字数 18225 阅读 1450

仿qq底部tab导航

本篇博客主要实现以下效果：

效果图

老规矩，废话 不多说，先看效果图

FragmentTabHost实现qq底部Tab实践的效果图

RadioGroup和ViewPager 实现可以滑动切换的仿qq底部Tab效果图

使用FragmentTabHost实现qq底部Tab切换

第一步先看布局文件

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.               android:layout_width="match_parent"
  4.               android:layout_height="match_parent"
  5.               android:orientation="vertical">
  6.     <!--用来填充Fragemnt的FrayLayout-->
  7.     <FrameLayout
  8.         android:id="@+id/main_layout_content"
  9.         android:layout_width="match_parent"
  10.         android:layout_height="0dp"
  11.         android:layout_weight="1">
  12.     </FrameLayout>
  13.     <!--FragmentTabHost-->
  14.     <android.support.v4.app.FragmentTabHost
  15.         android:id="@android:id/tabhost"
  16.         android:layout_width="match_parent"
  17.         android:layout_height="wrap_content"
  18.         android:background="#F6F6F6"
  19.         android:paddingBottom="5dp"
  20.         android:paddingTop="5dp">
  22.         <FrameLayout
  23.             android:id="@android:id/tabcontent"
  24.             android:layout_width="0dp"
  25.             android:layout_height="0dp"/>
  26.     </android.support.v4.app.FragmentTabHost>
  28. </LinearLayout>

其实很简单，没什么好说的 ，就是一个vertical的LinearLayout中放置着一个FrameLayout和FragmentTabHost

接下来我们来看一下代码

  1. public class FirstStyleActivity extends AppCompatActivity {
  2.     FragmentTabHost mTabHost;
  3.     private TabWidget mTabWidget;
  4.     private List<FragmentInfo> mFragmentEntities;
  5.     private static final String TAG = "xujun";
  6.     private static final String tag = "tag";
  7.     public static final String[] mTiltles = new String[]{
  8.             "首页", "课程", "直播", "个人"
  9.     };
  11.     @Override
  12.     protected void onCreate(Bundle savedInstanceState) {
  13.         super.onCreate(savedInstanceState);
  14.         setContentView(R.layout.activity_first_style);
  15.         mTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
  17.         mTabHost.setup(this, getSupportFragmentManager(), R.id.main_layout_content);
  18.         mTabWidget = mTabHost.getTabWidget();
  19.         //  去掉分割线
  20.         mTabWidget.setDividerDrawable(null);
  21.         mFragmentEntities = MainFragmentFactory.getInstance().getList();
  22.         initListener();
  23.         initData();
  26.     }
  28.     private void initData() {
  29.         int size = mFragmentEntities.size();
  30.         for (int i = 0; i < size; i++) {
  31.             Log.i(TAG, "size:=" + size);
  32.             FragmentInfo fragmentInfo = mFragmentEntities.get(i);
  33.             String title = fragmentInfo.getTitle();
  34.             TabHost.TabSpec tabSpec = mTabHost.newTabSpec(title).setIndicator(getTabView
  35.                     (i));
  36.             Bundle bundle = new Bundle();
  37.             bundle.putString(tag, mTiltles[i]);
  39.             mTabHost.addTab(tabSpec, fragmentInfo.getClz(), bundle);
  40.         }
  41.         updateTab(0);
  42.     }
  44.     private void initListener() {
  45.         mTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {
  46.             @Override
  47.             public void onTabChanged(String tabId) {
  48.                 int currentTab = mTabHost.getCurrentTab();
  49.                 Log.i(TAG, "onTabChanged：currentTab:=" + currentTab);
  50.                 updateTab(currentTab);
  51.             }
  52.         });
  53.     }
  55.     private View getTabView(int i) {
  56.         View view = View.inflate(this, R.layout.tab_layout, null);
  57.         int currentTab = mTabHost.getCurrentTab();
  58.         Log.i(TAG, "currentTab:=" + currentTab);
  59.         setSingleView(view, currentTab, i);
  60.         return view;
  61.     }
  63.     private void setSingleView(View view, int currentTab, int index) {
  64.         FragmentInfo fragmentInfo = mFragmentEntities.get(index);
  65.         int[] imagIds = fragmentInfo.getImagIds();
  66.         int[] colors = fragmentInfo.getColors();
  67.         TextView tv = (TextView) view.findViewById(R.id.tab_tv);
  68.         ImageView iv = (ImageView) view.findViewById(R.id.tab_icon);
  69.         tv.setText(fragmentInfo.getTitle());
  70.         Resources resources = getResources();
  71.         if (index == currentTab) {
  73.             tv.setTextColor(resources.getColor(colors[1]));
  74.             iv.setImageDrawable(resources.getDrawable(imagIds[1]));
  75.         } else {
  76.             tv.setTextColor(getResources().getColor(colors[0]));
  77.             iv.setImageDrawable(resources.getDrawable(imagIds[0]));
  78.         }
  79.     }
  81.     private void updateTab(int currentTab) {
  83.         int childCount = mTabWidget.getChildCount();
  84.         for (int i = 0; i < childCount; i++) {
  85.             View view = mTabWidget.getChildTabViewAt(i);
  86.             setSingleView(view, currentTab, i);
  88.         }
  91.     }
  92. }

其实说起来也很简单，主要分为以下步骤
- 第一步，实例化FragmentTabHost并设置相关样式

  1. mTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
  3. mTabHost.setup(this, getSupportFragmentManager(), R.id.main_layout_content);
  4. mTabWidget = mTabHost.getTabWidget();
  5. //  去掉分割线
  6. mTabWidget.setDividerDrawable(null);
  1.  for (int i = 0; i < size; i++) {
  2.     Log.i(TAG, "size:=" + size);
  3.     FragmentInfo fragmentInfo = mFragmentEntities.get(i);
  4.     String title = fragmentInfo.getTitle();
  5.     TabHost.TabSpec tabSpec = mTabHost.newTabSpec(title).setIndicator(getTabView
  6.             (i));
  7.     Bundle bundle = new Bundle();
  8.     bundle.putString(tag, mTiltles[i]);
  10.     mTabHost.addTab(tabSpec, fragmentInfo.getClz(), bundle);
  11. }
  1.  mTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {
  2.     @Override
  3.     public void onTabChanged(String tabId) {
  4.         int currentTab = mTabHost.getCurrentTab();
  5.         Log.i(TAG, "onTabChanged：currentTab:=" + currentTab);
  6.         updateTab(currentTab);
  7.     }
  8. });

运行上述代码及可以看到如下效果图

使用RadioGroup和RadioButton实现仿qq底部切换

第一步 ，先看布局文件

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout
  3.     android:id="@+id/activity_second_style"
  4.     xmlns:android="http://schemas.android.com/apk/res/android"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     android:orientation="vertical"
  8. >
  9.     <!--用来填充Fragemnt的FrayLayout-->
  10.     <FrameLayout
  11.         android:id="@+id/fl"
  12.         android:layout_width="match_parent"
  13.         android:layout_height="0dp"
  14.         android:layout_weight="1">
  16.     </FrameLayout>
  17.     <!--使用RadioGroup来实现tab的切换-->
  18.     <RadioGroup
  20.         android:id="@+id/rg"
  21.         android:layout_width="match_parent"
  22.         android:layout_height="wrap_content"
  23.         android:orientation="horizontal"
  24.     >
  25.         <RadioButton
  26.             android:id="@+id/rb_home"
  27.             style="@style/bottom_tab"
  28.             android:drawableTop="@drawable/sel_home"
  29.             android:text="首页"/>
  31.         <RadioButton
  32.             android:id="@+id/rb_course"
  33.             style="@style/bottom_tab"
  34.             android:drawableTop="@drawable/sel_course"
  35.             android:text="课程"/>
  37.         <RadioButton
  38.             android:id="@+id/rb_direct_seeding"
  39.             style="@style/bottom_tab"
  40.             android:drawableTop="@drawable/sel_direct_seeding"
  41.             android:text="直播"/>
  43.         <RadioButton
  44.             android:id="@+id/rb_me"
  45.             style="@style/bottom_tab"
  46.             android:drawableTop="@drawable/sel_me"
  47.             android:text="我的"/>
  49.     </RadioGroup>
  51. </LinearLayout>

其实每一个tab的选中时利用RadioGroup中RadioButton的互相排斥的特性，即每一次只能选中一个 RadioButton

至于bottom_tab的style，只不过是将相同的arr提取出来，减少布局的代码量和方便统一修改而已，平时我们在写布局代码 的时候也可以这样

  1. <style name="bottom_tab">
  2.     <item name="android:layout_width" >0dp</item>
  3.     <item name="android:layout_height" >wrap_content</item>
  4.     <item name="android:layout_weight" >1</item>
  5.     <item name="android:text" >0dp</item>
  6.     <item name="android:gravity" >center</item>
  7.     <item name="android:textColor" >@drawable/sel_bottom_tab_text</item>
  8.     <item name="android:padding" >8dp</item>
  9.     <item name="android:button" >@null</item>
  10. </style>

第二步，我们来看一下Activity的 代码

  1. public class ThreeActivity extends AppCompatActivity {
  3.     FrameLayout mFl;
  4.     RadioGroup mRg;
  5.     private FragmentManager mFragmentManager;
  7.     private int position = 0;
  9.     public static final String[] mTiltles = new String[]{
  10.             "首页", "课程", "直播", "个人"
  11.     };
  12.     private List<Fragment> mFragments;
  13.     private Fragment mCurFragment;
  15.     @Override
  16.     protected void onCreate(Bundle savedInstanceState) {
  17.         super.onCreate(savedInstanceState);
  18.         setContentView(R.layout.activity_three);
  19.         mFl = (FrameLayout) findViewById(R.id.fl);
  20.         mRg = (RadioGroup) findViewById(R.id.rg);
  21.         mFragments = new ArrayList<>();
  22.         for (int i = 0; i < mTiltles.length; i++) {
  23.             ItemFragement itemFragement = ItemFragement.newInstance(mTiltles[i]);
  24.             mFragments.add(itemFragement);
  25.         }
  26.         mCurFragment = mFragments.get(position);
  27.         replaceFragment(mCurFragment);
  29.         ((RadioButton)mRg.getChildAt(position)).setChecked(true);
  31.         initListener();
  32.     }
  34.     private void initListener() {
  35.         mRg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
  37.             @Override
  38.             public void onCheckedChanged(RadioGroup group, int checkedId) {
  40.                 RadioButton radioButton = (RadioButton) group.findViewById(checkedId);
  42.                 if (false == radioButton.isChecked()) {
  43.                     return;
  44.                 }
  47.                 switch (checkedId) {
  48.                     case R.id.rb_home:
  49.                         position = 0;
  50.                         break;
  52.                     case R.id.rb_course:
  53.                         position = 1;
  54.                         break;
  56.                     case R.id.rb_direct_seeding:
  57.                         position = 2;
  58.                         break;
  60.                     case R.id.rb_me:
  61.                         position = 3;
  62.                         break;
  63.                     default:
  64.                         position = 0;
  65.                         break;
  67.                 }
  68.                 LUtils.i("position==" + position);
  70.                 Fragment to = mFragments.get(position);
  71.                 showFragment(mCurFragment, to);
  72.                 mCurFragment = to;
  74.             }
  76.         });
  77.     }
  79.     private void showFragment(Fragment from, Fragment to) {
  80.         FragmentManager supportFragmentManager = getSupportFragmentManager();
  81.         FragmentTransaction transaction = supportFragmentManager.beginTransaction();
  82.         if (!to.isAdded()) {    // 先判断是否被add过
  83.             transaction.hide(from).add(R.id.fl, to).commit(); // 隐藏当前的fragment，add下一个到Activity中
  84.         } else {
  85.             transaction.hide(from).show(to).commit(); // 隐藏当前的fragment，显示下一个
  86.         }
  88.     }
  90.     /**
  91.      * 这个方法用老替换fragment
  92.      * xujun
  93.      * 2016/5/3 17:28.
  94.      */
  96.     private void replaceFragment(Fragment fragmeny) {
  97.         FragmentManager supportFragmentManager = getSupportFragmentManager();
  98.         FragmentTransaction fragmentTransaction = supportFragmentManager.beginTransaction();
  99.         fragmentTransaction.replace(R.id.fl, fragmeny).commit();
  100.     }
  102. }

思路解析
- 实例化各个控件，这里代码就不贴出来了
- 初始化 Fragemnt 和选中各个tab

  1.  mFragments = new ArrayList<>();
  2. for (int i = 0; i < mTiltles.length; i++) {
  3.     ItemFragement itemFragement = ItemFragement.newInstance(mTiltles[i]);
  4.     mFragments.add(itemFragement);
  5. }
  6. mCurFragment = mFragments.get(position);
  7. replaceFragment(mCurFragment);
  9. ((RadioButton)mRg.getChildAt(position)).setChecked(true);
  11. private void replaceFragment(Fragment fragmeny) {
  12.     FragmentManager supportFragmentManager = getSupportFragmentManager();
  13.     FragmentTransaction fragmentTransaction = supportFragmentManager.beginTransaction();
  14.     fragmentTransaction.replace(R.id.fl, fragmeny).commit();
  15. }
  1.  mRg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
  3.     @Override
  4.     public void onCheckedChanged(RadioGroup group, int checkedId) {
  6.         RadioButton radioButton = (RadioButton) group.findViewById(checkedId);
  8.         if (false == radioButton.isChecked()) {
  9.             return;
  10.         }
  13.         switch (checkedId) {
  14.             case R.id.rb_home:
  15.                 position = 0;
  16.                 break;
  18.             case R.id.rb_course:
  19.                 position = 1;
  20.                 break;
  22.             case R.id.rb_direct_seeding:
  23.                 position = 2;
  24.                 break;
  26.             case R.id.rb_me:
  27.                 position = 3;
  28.                 break;
  29.             default:
  30.                 position = 0;
  31.                 break;
  33.         }
  34.         LUtils.i("position==" + position);
  36.         Fragment to = mFragments.get(position);
  37.         showFragment(mCurFragment, to);
  38.         mCurFragment = to;
  40.     }
  42. });

使用RadioGroup和ViewPager 实现可以滑动切换的仿qq底部Tab切换

第一步，我们 同样先看布局代码

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout
  3.     android:id="@+id/activity_second_style"
  4.     xmlns:android="http://schemas.android.com/apk/res/android"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     android:orientation="vertical"
  8. >
  9.     <!--用来填充Fragemnt的ViewPager-->
  10.     <android.support.v4.view.ViewPager
  11.         android:id="@+id/viewPager"
  12.         android:layout_width="match_parent"
  13.         android:layout_height="0dp"
  14.         android:layout_weight="1">
  16.     </android.support.v4.view.ViewPager>
  17.     <!--使用RadioGroup来实现tab的切换-->
  18.     <RadioGroup
  20.         android:id="@+id/rg"
  21.         android:layout_width="match_parent"
  22.         android:layout_height="wrap_content"
  23.         android:orientation="horizontal"
  24.     >
  25.         <RadioButton
  26.             android:id="@+id/rb_home"
  27.             style="@style/bottom_tab"
  28.             android:drawableTop="@drawable/sel_home"
  29.             android:text="首页"/>
  31.         <RadioButton
  32.             android:id="@+id/rb_course"
  33.             style="@style/bottom_tab"
  34.             android:drawableTop="@drawable/sel_course"
  35.             android:text="课程"/>
  37.         <RadioButton
  38.             android:id="@+id/rb_direct_seeding"
  39.             style="@style/bottom_tab"
  40.             android:drawableTop="@drawable/sel_direct_seeding"
  41.             android:text="直播"/>
  43.         <RadioButton
  44.             android:id="@+id/rb_me"
  45.             style="@style/bottom_tab"
  46.             android:drawableTop="@drawable/sel_me"
  47.             android:text="我的"/>
  49.     </RadioGroup>
  51. </LinearLayout>

第二步，我们一起来看一下Activity代码

  1. public class SecondStyleActivity extends AppCompatActivity {
  3.     public static final String[] mTiltles = new String[]{
  4.             "首页", "课程", "直播", "个人"
  5.     };
  6.     private List<Fragment> mFragments;
  7.     ViewPager mViewPager;
  8.     RadioGroup mRg;
  9.     private int position = 0;
  11.     @Override
  12.     protected void onCreate(Bundle savedInstanceState) {
  13.         super.onCreate(savedInstanceState);
  14.         setContentView(R.layout.activity_second_style);
  15.         mViewPager = (ViewPager) findViewById(R.id.viewPager);
  16.         mRg = (RadioGroup) findViewById(R.id.rg);
  17.         initListener();
  18.         initData();
  21.     }
  23.     private void initData() {
  24.         mFragments = new ArrayList<>();
  25.         for (int i = 0; i < mTiltles.length; i++) {
  26.             ItemFragement itemFragement = ItemFragement.newInstance(mTiltles[i]);
  27.             mFragments.add(itemFragement);
  28.         }
  29.         BaseFragmentAdapter fragmentAdapter = new BaseFragmentAdapter
  30.                 (getSupportFragmentManager(), mFragments, mTiltles);
  31.         mViewPager.setAdapter(fragmentAdapter);
  32.         mViewPager.setCurrentItem(position);
  33.         ((RadioButton) mRg.getChildAt(position)).setChecked(true);
  34.     }
  36.     private void initListener() {
  37.         mViewPager.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
  38.             @Override
  39.             public void onPageSelected(int position) {
  40.                 RadioButton radioButton = (RadioButton) mRg.getChildAt(position);
  41.                 radioButton.setChecked(true);
  42.             }
  43.         });
  45.         mRg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
  47.             @Override
  48.             public void onCheckedChanged(RadioGroup group, int checkedId) {
  49.                 RadioButton rb = (RadioButton) group.findViewById(checkedId);
  50.                 if (!rb.isChecked()) {
  51.                     return;
  52.                 }
  53.                 switch (checkedId) {
  54.                     case R.id.rb_home:
  55.                         position = 0;
  56.                         break;
  58.                     case R.id.rb_course:
  59.                         position = 1;
  60.                         break;
  62.                     case R.id.rb_direct_seeding:
  63.                         position = 2;
  64.                         break;
  66.                     case R.id.rb_me:
  67.                         position = 3;
  68.                         break;
  69.                     default:
  70.                         position = 0;
  71.                         break;
  73.                 }
  74.                 mViewPager.setCurrentItem(position);
  75.             }
  76.         });
  77.     }
  78. }

思路解析如下
- 实例化ViewPager和RadioGroup

  1.  mViewPager = (ViewPager) findViewById(R.id.viewPager);
  2.  mRg = (RadioGroup) findViewById(R.id.rg);
  1.  mFragments = new ArrayList<>();
  2. for (int i = 0; i < mTiltles.length; i++) {
  3.     ItemFragement itemFragement = ItemFragement.newInstance(mTiltles[i]);
  4.     mFragments.add(itemFragement);
  5. }
  6. BaseFragmentAdapter fragmentAdapter = new BaseFragmentAdapter
  7.         (getSupportFragmentManager(), mFragments, mTiltles);
  8. mViewPager.setAdapter(fragmentAdapter);
  9. mViewPager.setCurrentItem(position);
  10. ((RadioButton) mRg.getChildAt(position)).setChecked(true);
  1.  mViewPager.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
  2.     @Override
  3.     public void onPageSelected(int position) {
  4.         RadioButton radioButton = (RadioButton) mRg.getChildAt(position);
  5.         radioButton.setChecked(true);
  6.     }
  7. });
  9. mRg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
  11.     @Override
  12.     public void onCheckedChanged(RadioGroup group, int checkedId) {
  13.         RadioButton rb = (RadioButton) group.findViewById(checkedId);
  14.         if (!rb.isChecked()) {
  15.             return;
  16.         }
  17.         switch (checkedId) {
  18.             case R.id.rb_home:
  19.                 position = 0;
  20.                 break;
  22.             case R.id.rb_course:
  23.                 position = 1;
  24.                 break;
  26.             case R.id.rb_direct_seeding:
  27.                 position = 2;
  28.                 break;
  30.             case R.id.rb_me:
  31.                 position = 3;
  32.                 break;
  33.             default:
  34.                 position = 0;
  35.                 break;
  37.         }
  38.         mViewPager.setCurrentItem(position);
  39.     }
  40. });

### 注意事项
我们可以通过以下方法设置ViewPager左右页面 能缓存的fragment 数量

  1. //  设置左右页面 能缓存的fragment 数量
  2. mViewPager.setOffscreenPageLimit(fragmentAdapter.getCount() - 1);

到此仿qq底部tab切换的集中方法已经讲解完毕，之所以讲解了 三种方法，是想让大家了解多种实现方式，因为每一个人的习惯bout不一样，有些人习惯使用与第一种方式，有人习惯使用第二种方式。。。了解多种 实现方式以后，我们 要读懂别人 的代码也容易得多了，其实我们还可以使用自定义控件来实现，方法也比较简单，这里就不讲解了，有兴趣的话，可以去 阅读 这篇博客

下面我将为大家讲解Fragment的 一些优化

解决Fragment多次实例化的几种方案

目前本人了解到的解决方案 ，无非是利用一下两种思想

第一种解决方法

在onCreateView中避免多次实例化View，可通过判断View是否为空，来实现相应的 逻辑操作,核心代码如下

  1.    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable
  2.             Bundle savedInstanceState) {
  3.         LUtils.i(getClass().getSimpleName()+">>>>>>>>>>>　　onCreateView");
  4.         if(mView==null){
  5.             mContext = getContext();
  6.             mView=View.inflate(mContext,getLayoutId(),null);
  7.             initView(mView);
  8.             LUtils.i(getClass().getSimpleName()+">>>>>>>>>>>　　initView");
  9.         }else{
  10.             // 缓存的rootView需要判断是否已经被加过parent，如果有parent需要从parent删除，
  11.             // 要不然会发生这个rootview已经有parent的错误。
  12.             ViewGroup parent =(ViewGroup) mView.getParent();
  13.             if(parent!=null){
  14.                 parent.removeView(mView);
  15.             }
  16.             LUtils.i(getClass().getSimpleName()+">>>>>>>>>>>　　removeView");
  17.         }
  18.         return mView;
  19.     }

第二种解决方案

在项目中需要进行Fragment的切换，用hide（）和show（）方法结合起来来替代replace()方法来实现Fragment的切换：

  1. private void showFragment(Fragment from, Fragment to) {
  2.     FragmentManager supportFragmentManager = getSupportFragmentManager();
  3.     FragmentTransaction transaction = supportFragmentManager.beginTransaction();
  4.     if (!to.isAdded()) {    // 先判断是否被add过
  5.         transaction.hide(from).add(R.id.fl, to).commit(); // 隐藏当前的fragment，add下一个到Activity中
  6.     } else {
  7.         transaction.hide(from).show(to).commit(); // 隐藏当前的fragment，显示下一个
  8.     }
  10. }
  12. /**
  13.  * 这个方法用老替换fragment
  14.  * xujun
  15.  * 2016/5/3 17:28.
  16.  */
  18. private void replaceFragment(Fragment fragmeny) {
  19.     FragmentManager supportFragmentManager = getSupportFragmentManager();
  20.     FragmentTransaction fragmentTransaction = supportFragmentManager.beginTransaction();
  21.     fragmentTransaction.replace(R.id.fl, fragmeny).commit();
  22. }

关于 避免Fragment的多次实例化的分析与优化到此为止，下面我们一起来看一下 则那样实现Fragemnt 的 懒加载

Fragemnt的懒加载（网上很多人称之为Fragemnt的最优加载）

关于懒加载的这部分，代码是参考这篇 博客的 ViewPager+Fragment LazyLoad最优解

我们知道 ViewPager通常 会有预加载机制，默认情况下会先加载左右一页的数据，有时候我们想等待页面可见的时候在去加载网络 数据 ，解决方案如下

下面 先贴出代码

  1. public abstract class BasePageFragment extends Fragment {
  3.     protected View mView;
  5.     /**
  6.      * 表示View是否被初始化
  7.      */
  8.     protected boolean isViewInitiated;
  9.     /**
  10.      * 表示对用户是否可见
  11.      */
  12.     protected boolean isVisibleToUser;
  13.     /**
  14.      * 表示数据是否初始化
  15.      */
  16.     protected boolean isDataInitiated;
  17.     private Context mContext;
  19.     @Override
  20.     public void onCreate(Bundle savedInstanceState) {
  21.         super.onCreate(savedInstanceState);
  22.         LUtils.i(getClass().getSimpleName() + ">>>>>>>>>>>　　onCreate");
  23.     }
  25.     @Nullable
  26.     @Override
  27.     public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable
  28.             Bundle savedInstanceState) {
  29.         LUtils.i(getClass().getSimpleName() + ">>>>>>>>>>>　　onCreateView");
  30.         if (mView == null) {
  31.             mContext = getContext();
  32.             mView = View.inflate(mContext, getLayoutId(), null);
  33.             initView(mView);
  34.             LUtils.i(getClass().getSimpleName() + ">>>>>>>>>>>　　initView");
  35.         } else {
  36.             // 缓存的rootView需要判断是否已经被加过parent，如果有parent需要从parent删除，
  37.             // 要不然会发生这个rootview已经有parent的错误。
  38.             ViewGroup parent = (ViewGroup) mView.getParent();
  39.             if (parent != null) {
  40.                 parent.removeView(mView);
  41.             }
  42.             LUtils.i(getClass().getSimpleName() + ">>>>>>>>>>>　　removeView");
  43.         }
  44.         return mView;
  45.     }
  47.     protected abstract void initView(View view);
  49.     protected abstract int getLayoutId();
  51.     @Override
  52.     public void onActivityCreated(Bundle savedInstanceState) {
  53.         super.onActivityCreated(savedInstanceState);
  54.         LUtils.i(getClass().getSimpleName() + ">>>>>>>>>>>　　onActivityCreated");
  55.         isViewInitiated = true;
  56.         initData();
  57.         prepareFetchData();
  58.     }
  60.     @Override
  61.     public void setUserVisibleHint(boolean isVisibleToUser) {
  62.         super.setUserVisibleHint(isVisibleToUser);
  63.         this.isVisibleToUser = isVisibleToUser;
  64.         prepareFetchData();
  65.     }
  67.     public abstract void fetchData();
  69.     public boolean prepareFetchData() {
  70.         return prepareFetchData(false);
  71.     }
  73.     /***
  74.      * 
  75.      * @param forceUpdate 表示是否在界面可见的时候是否强制刷新数据
  76.      * @return
  77.      */
  78.     public boolean prepareFetchData(boolean forceUpdate) {
  79.         if (isVisibleToUser && isViewInitiated && (!isDataInitiated || forceUpdate)) {
  80.             //  界面可见的时候再去加载数据
  81.             fetchData();
  82.             isDataInitiated = true;
  83.             return true;
  84.         }
  85.         return false;
  86.     }
  88.     @Override
  89.     public void onDestroyView() {
  90.         super.onDestroyView();
  91.         LUtils.i(getClass().getSimpleName() + ">>>>>>>>>>>　　onDestroyView");
  92.     }
  94.     protected void initData() {
  95.     }
  97. }

思路解析：
其实核心思想主要在setUserVisibleHint(boolean isVisibleToUser)方法中，这个方法在Fragemnt界面切换到可见或者 不可见的时候调用，isVisibleToUser表示当前界面可见 或者不可见

setUserVisibleHint(boolean isVisibleToUser)

Set a hint to the system about whether this fragment's UI is currently visible to the user.

于是我们在prepareFetchData进行判断只有当界面可见的情况下才会尝试判断是否调用fetchData() 方法，于是我们就可以实现等到界面可见的 时候才加载网络数据，将我们加载网络数据的 逻辑的实现放在fetchData()
里面即可

  2. /***
  3.  *
  4.  * @param forceUpdate 表示是否在界面可见的时候是否强制刷新数据
  5.  * @return
  6.  */
  7. public boolean prepareFetchData(boolean forceUpdate) {
  8.     if (isVisibleToUser && isViewInitiated && (!isDataInitiated || forceUpdate)) {
  9.         //  界面可见的时候再去加载数据
  10.         fetchData();
  11.         isDataInitiated = true;
  12.         return true;
  13.     }
  14.     return false;
  15. }

题外话

转眼间校招季已经过去了一个多月了，虽然没能进入到bat，网易之类的公司，不过也找到了相对比较喜欢的公司，接下来的日子就专心做毕业设计了，计划在十一月的时候出省旅游一次，明年春节回来的时候再去公司实习，悄悄地告诉你一件事哦，本人 还没有 出过广东省 ，哈哈，是不是很low呢？

转载请注明博客地址：http://blog.csdn.net/gdutxiaoxu/article/details/52826810

源码下载地址：https://github.com/gdutxiaoxu/QQBottomTab.git

添加新批注
在作者公开此批注前，只有你和作者可见。
回复批注