实现android 底部导航的方式有好几种如:fragment:、TabActivity、ViewGroup、viewPager等,
这里介绍使用viewPager实现底部导航。
先说说使用viewPager实现的原因
1、fragment
a 我们需要使用fragment的话,我们只能用v4包里面的fragment,因为我们需要向下兼容。android.support.v4.app的Fragment中找不到getChildFragmentManager()方法
2、viewPager:
a 因为使用起来方便。
3、TabActivity:
a TabActivity 过时,直接使用fragment 即可
b Activity是android里面的四大组件。是重量级的组件,fragment是android里面的片段,是特殊的view,他具备生命周期。
4、ViewGroup :
a :属于低级组件。比较麻烦。
首先自定义懒加载的viewpager,目的是 :不需要让viewpage默认加载下一页。
查看ViewPager的源码发现有这么一个变量DEFAULT_OFFSCREEN_PAGES 控制加载页面的个数
private static final int DEFAULT_OFFSCREEN_PAGES = 1;//默认加载page的大小
private int mOffscreenPageLimit = DEFAULT_OFFSCREEN_PAGES;
final int pageLimit = mOffscreenPageLimit;
final int startPos = Math.max(0, mCurItem - pageLimit);
final int N = mAdapter.getCount();
final int endPos = Math.min(N-1, mCurItem + pageLimit);
当DEFAULT_OFFSCREEN_PAGES=1时 选择第一个pager时,即mCurItem =0时 假如说一共有3个页面 N=3
startPos = Math.max(0, mCurItem - pageLimit); startPos=0
endPos = Math.min(N-1, mCurItem + pageLimit); endPos=1
当DEFAULT_OFFSCREEN_PAGES=1时 选择第二个pager时,即mCurItem =1时 假如说一共有3个页面 N=3
startPos = Math.max(0, mCurItem - pageLimit); startPos=1
endPos = Math.min(N-1, mCurItem + pageLimit); endPos=2
当DEFAULT_OFFSCREEN_PAGES=1时 选择第三个pager时,即mCurItem =2时 假如说一共有3个页面 N=3
startPos = Math.max(0, mCurItem - pageLimit); startPos=2
endPos = Math.min(N-1, mCurItem + pageLimit); endPos=2
故若想实现不需要让viewpage默认加载下一页,只需更改变量值为0即可。
private static final int DEFAULT_OFFSCREEN_PAGES = 0;//默认的加载页面,ViewPager是1个,所以会加载两个Fragment
当DEFAULT_OFFSCREEN_PAGES=0时 选择第一个pager时,即mCurItem =0时 假如说一共有3个页面 N=3
startPos = Math.max(0, mCurItem - pageLimit); startPos=0
endPos = Math.min(N-1, mCurItem + pageLimit); endPos=0
当DEFAULT_OFFSCREEN_PAGES=0时 选择第二个pager时,即mCurItem =1时 假如说一共有3个页面 N=3
startPos = Math.max(0, mCurItem - pageLimit); startPos=1
endPos = Math.min(N-1, mCurItem + pageLimit); endPos=1
当DEFAULT_OFFSCREEN_PAGES=0时 选择第三个pager时,即mCurItem =2时 假如说一共有3个页面 N=3
startPos = Math.max(0, mCurItem - pageLimit); startPos=2
endPos = Math.min(N-1, mCurItem + pageLimit); endPos=2
解决了ViewPager预加载的问题,下面解决禁止ViewPager滑动
重写两个方法就可以禁止ViewPager滑动了,如果想实现可以滑动 将变量setTouchMode改为true即可。
<span style="white-space:pre"> </span>private boolean setTouchMode = false; <span style="white-space:pre"> </span>@Override public boolean onInterceptTouchEvent(MotionEvent ev) { if (setTouchMode) return super.onInterceptTouchEvent(ev); else return false; } <span style="white-space:pre"> </span>@Override public boolean onTouchEvent(MotionEvent ev) { if(setTouchMode) return super.onTouchEvent(ev); else return false; }
下面是主页面的布局代码activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <view android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="0dip" android:layout_weight="1.0" class="com.yuweiguo.bottomnavibyviewpager.view.MyViewPager" /> <RadioGroup android:id="@+id/main_radio" android:layout_width="fill_parent" android:layout_height="60dp" android:layout_gravity="bottom" android:background="#133575" android:gravity="center_vertical" android:orientation="horizontal" android:paddingTop="2dp" > <RadioButton android:id="@+id/rb_navi" style="@style/main_tab_bottom" android:drawableTop="@drawable/tab_selector1" /> <RadioButton android:id="@+id/rb_routeplan" style="@style/main_tab_bottom" android:drawableTop="@drawable/tab_selector2" /> <RadioButton android:id="@+id/rb_location" style="@style/main_tab_bottom" android:drawableTop="@drawable/tab_selector3" /> <RadioButton android:id="@+id/rb_setting" style="@style/main_tab_bottom" android:drawableTop="@drawable/tab_selector4" /> </RadioGroup> </LinearLayout>
package com.yuweiguo.bottomnavibyviewpager; import java.util.ArrayList; import java.util.List; import android.app.Activity; import android.content.Intent; import android.os.Bundle; import android.support.v4.view.PagerAdapter; import android.view.KeyEvent; import android.view.View; import android.view.ViewGroup; import android.widget.RadioGroup; import android.widget.RadioGroup.OnCheckedChangeListener; import android.widget.Toast; import com.yuweiguo.bottomnavibyviewpager.base.BasePager; import com.yuweiguo.bottomnavibyviewpager.pager.MessagePager; import com.yuweiguo.bottomnavibyviewpager.pager.NaviPager; import com.yuweiguo.bottomnavibyviewpager.pager.RouteplanPager; import com.yuweiguo.bottomnavibyviewpager.pager.SearchPager; import com.yuweiguo.bottomnavibyviewpager.view.LazyViewPager.OnPageChangeListener; import com.yuweiguo.bottomnavibyviewpager.view.MyViewPager; public class MainActivity extends Activity { private MyViewPager viewpager; private RadioGroup main_radio; private List<BasePager> pages = new ArrayList<BasePager>(); private ViewPageAdapter viewPageAdapter; private int currentItem = R.id.rb_navi; private int oldPosition = 2; public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); viewpager = (MyViewPager) findViewById(R.id.viewpager); main_radio = (RadioGroup) findViewById(R.id.main_radio); pages.clear(); pages.add(new NaviPager(this)); pages.add(new RouteplanPager(this)); pages.add(new SearchPager(this)); pages.add(new MessagePager(this)); viewPageAdapter = new ViewPageAdapter(pages); viewpager.setAdapter(viewPageAdapter); viewpager.setOnPageChangeListener(new OnPageChangeListener() { @Override public void onPageSelected(int position) { BasePager pager = pages.get(position); pager.onResume(); pager.initData(); } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageScrollStateChanged(int state) { } }); main_radio.setOnCheckedChangeListener(new OnCheckedChangeListener() { @Override public void onCheckedChanged(RadioGroup group, int checkedId) { switch (checkedId) { case R.id.rb_navi: if (oldPosition != 0) { pages.get(oldPosition).onPause(); oldPosition = 0; } viewpager.setCurrentItem(0, false); break; case R.id.rb_routeplan: if (oldPosition != 1) { pages.get(oldPosition).onPause(); oldPosition = 1; } viewpager.setCurrentItem(1, false); break; case R.id.rb_location: if (oldPosition != 2) { pages.get(oldPosition).onPause(); oldPosition = 2; } viewpager.setCurrentItem(2, false); break; case R.id.rb_setting: if (oldPosition != 3) { pages.get(oldPosition).onPause(); oldPosition = 3; } viewpager.setCurrentItem(3, false); break; } currentItem = checkedId; } }); main_radio.check(currentItem); } @Override protected void onResume() { super.onResume(); pages.get(oldPosition).onResume(); } @Override protected void onPause() { super.onPause(); pages.get(oldPosition).onPause(); } public class ViewPageAdapter extends PagerAdapter { private List<BasePager> list; public ViewPageAdapter(List<BasePager> pages) { this.list = pages; } @Override public void destroyItem(ViewGroup container, int position, Object object) { ((MyViewPager) container).removeView(list.get(position) .getRootView()); } @Override public Object instantiateItem(ViewGroup container, int position) { ((MyViewPager) container).addView(list.get(position).getRootView(), 0); return list.get(position).getRootView(); } @Override public int getCount() { return list.size(); } @Override public boolean isViewFromObject(View arg0, Object arg1) { return arg0 == arg1; } } @Override protected void onDestroy() { if (pages != null) { for (BasePager pager : pages) { pager.onDestroy(); } } super.onDestroy(); } }
最后上效果图