Android

BottomNavigationView优雅实现Fragment

2017-07-31  本文已影响0人  程自舟

很多app都挺流行一个Activity底部导航上面加载多个frangment的设计,我们常规实现思路是做很多判断,然后去不停的hide,show这样的方法实现可行但是是有弊端的(就我个人遇到的情况来说,fragment重复加载(偶尔),该清空的时候并没有清空),更何况这样写代码一堆堆的,一点也不优雅。
现在我们就来看看使用Google新推出的MD控件BottomNavigationView来如何实现。
首先,先上主activity的布局

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
   <FrameLayout
        android:id="@+id/lay_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginBottom="@dimen/len_52"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />
  <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="match_parent"
        android:layout_height="@dimen/len_52"
        android:layout_gravity="bottom"
        android:background="@color/white"
        android:elevation="@dimen/len_4"
        android:outlineProvider="bounds"
        android:translationZ="@dimen/len_8"
        app:itemIconTint="@color/text_nav"
        app:itemTextColor="@color/text_nav"
        app:menu="@menu/navigation_items"
        tools:targetApi="lollipop"
        tools:visibility="invisible" />
</android.support.design.widget.CoordinatorLayout>

我们需要一个Framlayout来做容器放入fragment,然后设置相关BottomNavigationView的属性和参数。
然后我们在activity里实现BottomNavigationView的选择监听

    public boolean onNavigationItemSelected(@NonNull MenuItem item) {
          
        //转接事件流到工具中
        return mNavHelper.performClickMenu(item.getItemId());
    }

onNavigationItemSelected方法本来是return true或者fasle的代表是否处理选择事件处理,在这里,我们转入自己的工具类里处理,所以我们建一个工具类NavHelper,并定义事件处理方法performClickMenu()。
我们先定义需要的参数和构造方法

    private final SparseArray<Tab<T>> tabs = new SparseArray<Tab<T>>();

    private final Context mContext;
    private final int containerId;
    private final FragmentManager fragmentManager;
    private final OnTabChangeListener<T> mListener;

    private Tab<T> currentTab;

    public NavHelper(Context mContext, int containerId, FragmentManager fragmentManager, OnTabChangeListener<T> mListener) {
        this.mContext = mContext;
        this.containerId = containerId;
        this.fragmentManager = fragmentManager;
        this.mListener = mListener;
    }

    public static class Tab<T> {
        public Tab(Class<?> clx, T extra) {
            this.clx = clx;
            this.extra = extra;
        }

        public Class<?> clx;
        public T extra;
        //内部缓存对应的Fragment
        private Fragment fragment;
    }
   /**
     * 事件处理回调接口
     *
     * @param <T>
     */
    public interface OnTabChangeListener<T> {
        void onTabChange(Tab<T> newTab, Tab<T> oldTab);
    }

我们的构造参数里有四个参数,content不必多说,containerId表示放入fragment的容器Id,framentManager也是必须的(注意必须为V4包),最后个就是我们的事件回调监听。
当然,我们还要定义个SparseArray来存储,这里不选择使用List是因为List太过厚重。
而至于Tab这个类是我们自己定义的,使他静态化是并不希望外部收到外界的干扰,因为他只提供内部使用。Tab里的字段clx是通过传入的class去寻找对应的framnegt,所以<? extends fragment>,extra则表示是额外操作的字段,但是我们并不知道具体操作是什么,所以采用泛型来映射。剩下的一个fragment表示是内部缓存对应的fragemnt。

那么接下来我们就在performClickMenu方法里进行事件处理。

    public boolean performClickMenu(int menuId) {
        Tab<T> tab = tabs.get(menuId);
        if (tab != null) {
            doSelect(tab);
            return true;
        }

        return false;
    }

我们在这里与onNavigationItemSelected返回值设定一样,return true代表处理事件,return false代表无权处理。
首先进行非空判断,不为空进入我们的doSelect();

  private void doSelect(Tab<T> tab){
        Tab<T> oldTab = null;
        if (currentTab!=null){
            oldTab=currentTab;
            if (oldTab==tab){
                //如果当前tab点击的tab,不做任何操作或者刷新
                notifyReselect(tab);
                return;
            }
        }
        currentTab = tab;
        doTabChanged(currentTab,oldTab);
    }

我们先声明一个tab为oldTab表示旧fragemnt并初始化,然后用我们定义的currentTab(当前fragment)进行非空判断,不为空我们就把currentTab赋值给oldTab,然后我们判断oldtab(旧Fragemnt)是否等于传入的tab(要切换的新Fragment),如果等于表示是对一个frangment进行了两次点击,这里可以直接return,也可以刷新当前fragemnt。如果currentTab(当前fragment)为空,那么我们就把要切换的fragement赋值给currentTab,然后进行切换改变的逻辑处理。

 private void doTabChanged(Tab<T> newTab,Tab<T> oldTab){
        FragmentTransaction ft = fragmentManager.beginTransaction();

        if (oldTab!=null){
            if (oldTab.fragment!=null){
                //从界面移除,但在Fragment的缓存中
                ft.detach(oldTab.fragment);
            }
        }

        if (newTab!=null){
            if (newTab.fragment==null){
                //首次新建并缓存
                Fragment fragment = Fragment.instantiate(mContext,newTab.clx.getName(),null);
                newTab.fragment = fragment;
                ft.add(containerId,fragment,newTab.clx.getName());
            }else {
            //直接从缓存中重用,不会被测量
                ft.attach(newTab.fragment);
            }
        }
        ft.commit();
        notifySelect(newTab,oldTab);
    }

我们在doTabChanged(Tab<T> newTab,Tab<T> oldTab)里传入两个参数,newTab表示要切换到的fragment,oldTab表示被切换的fragment。然后分别进行判断,如果oldTab!=null,并且缓存里的fragment也!=null;那么调用 FragmentTransaction.detach方法移除(仍在内存中)。
如果newTab!=null,并且缓存里的fragment也==null,那么就新建并缓存起来,如果缓存里有,就直接attach。
最后就是通知选择的监听回调了。至此我们的工具类已经封装完成,接下来就是实际使用了。

    mNavHelper = new NavHelper<>(this,R.id.lay_container,getSupportFragmentManager(),this);
        mNavHelper.add(R.id.action_home,new NavHelper.Tab<>(ActiveFragment.class,R.string.title_fragemnt1
        ))
        .add(R.id.action_group,new NavHelper.Tab<>(GroupFragment.class,R.string.title_fragemnt2))
        .add(R.id.action_contact,new NavHelper.Tab<>(ContactFragment.class,R.string.title_fragemnt3));

        mNavigation.setOnNavigationItemSelectedListener(this);
  //手动触发第一次点击
        Menu menu = mNavigation.getMenu();
        menu.performIdentifierAction(R.id.action_home,0);
   public void onTabChange(NavHelper.Tab<Integer> newTab, NavHelper.Tab<Integer> oldTab) {
//fragemnt的对应title
        mTitle.setText(newTab.extra);
}

下面附上完整NavHelper

public class NavHelper<T> {
    private final SparseArray<Tab<T>> tabs = new SparseArray<Tab<T>>();

    private final Context mContext;
    private final int containerId;
    private final FragmentManager fragmentManager;
    private final OnTabChangeListener<T> mListener;

    private Tab<T> currentTab;

    public NavHelper(Context mContext, int containerId, FragmentManager fragmentManager, OnTabChangeListener<T> mListener) {
        this.mContext = mContext;
        this.containerId = containerId;
        this.fragmentManager = fragmentManager;
        this.mListener = mListener;
    }

    /**
     * 添加tab
     *
     * @param menuId
     * @param tab
     * @return
     */
    public NavHelper<T> add(int menuId, Tab<T> tab) {
        tabs.put(menuId, tab);
        return this;
    }

    /**
     * 获取当前Tab
     *
     * @return
     */
    public Tab<T> getCurrentTab() {
        return currentTab;
    }

    /**
     * 执行点击菜单的操作
     *
     * @param menuId
     * @return
     */
    public boolean performClickMenu(int menuId) {
        Tab<T> tab = tabs.get(menuId);
        if (tab != null) {
            doSelect(tab);
            return true;
        }

        return false;
    }

    /**
     * 进行tab的选择操作
     * @param tab
     */
    private void doSelect(Tab<T> tab){
        Tab<T> oldTab = null;
        if (currentTab!=null){
            oldTab=currentTab;
            if (oldTab==tab){
                //如果当前tab点击的tab,不做任何操作或者刷新
                notifyReselect(tab);
                return;
            }
        }
        currentTab = tab;
        doTabChanged(currentTab,oldTab);
    }

    /**
     * Tab切换方法
     * @param newTab
     * @param oldTab
     */
    private void doTabChanged(Tab<T> newTab,Tab<T> oldTab){
        FragmentTransaction ft = fragmentManager.beginTransaction();

        if (oldTab!=null){
            if (oldTab.fragment!=null){
                //从界面移除,但在Fragment的缓存中
                ft.detach(oldTab.fragment);
            }
        }

        if (newTab!=null){
            if (newTab.fragment==null){
                //首次新建并缓存
                Fragment fragment = Fragment.instantiate(mContext,newTab.clx.getName(),null);
                newTab.fragment = fragment;
                ft.add(containerId,fragment,newTab.clx.getName());
            }else {
                ft.attach(newTab.fragment);
            }
        }
        ft.commit();
        notifySelect(newTab,oldTab);
    }

    /**
     * 选择通知回调
     * @param newTab
     * @param oldTab
     */
    private void notifySelect(Tab<T> newTab,Tab<T> oldTab){
        if (mListener!=null){
            mListener.onTabChange(newTab,oldTab);
        }

    }

    private void notifyReselect(Tab<T> tab){
    //TODO 刷新
    }

    public static class Tab<T> {
        public Tab(Class<?> clx, T extra) {
            this.clx = clx;
            this.extra = extra;
        }

        Class<?> clx;
        public T extra;
        //内部缓存对应的Fragment
        private Fragment fragment;
    }

    /**
     * 事件处理回调接口
     *
     * @param <T>
     */
    public interface OnTabChangeListener<T> {
        void onTabChange(Tab<T> newTab, Tab<T> oldTab);
    }
}
上一篇下一篇

猜你喜欢

热点阅读