美文网首页
安卓实现点击底部导航栏返回顶部&刷新功能

安卓实现点击底部导航栏返回顶部&刷新功能

作者: 512DIDIDI | 来源:发表于2018-11-05 16:51 被阅读0次

现在的app几乎都是伴随着底部导航栏,
页面往往存在着ScrollView或者RecyclerView等可滑动的ViewGroup,
因此刷新返回顶部的功能是必备的,
通过点击底部导航栏返回顶部刷新显然是最合适的,


先说明一下项目结构:

底部导航栏切换fragment的实现就是FrameLayout+tab,并在BaseBottomDelegate中加载。

fragment内容页面定义一个抽象类BottomItemDelegate,并实现IClickTabListener接口。

在具体的fragment内容页面重写IClickTabListener方法。


首先,需要先定义一个接口IClickTabListener,以供具体的子类实现方法:

public interface IClickTabListener {

  /**
  * 点击tab返回顶部
  */
  void onScrollToTop();

  /**
   * 判断当前页面是否处于顶部
   * @return 是否位于顶部
   */
  boolean isTop();

   /**
   * 点击tab刷新页面
   */
  void onRefresh();
}

然后,在抽象fragment内容页面BottomItemDelegate实现该接口:

public abstract class BottomItemDelegate extends PocketDelegate implements IClickTabListener

在具体的子类中重写IClickTabListener的方法:

public class HomeItemDelegate extends BottomItemDelegate{
  ... ...
   /**
   * 重写父类的onScrollToTop(),使scrollView滚动到顶部
   */
  @Override
  public void onScrollToTop() {
    //设置toolbar的内容自动滑出来
    mAppbar.setExpanded(true);
    //ScrollView滚动到顶部
    mScrollView.smoothScrollTo(0,0);
  }

  /**
   * 重写父类的onRefresh(),刷新当前页面
   */
  @Override
  public void onRefresh() {
    //刷新样式出现
    mRefresh.setRefreshing(true);
    //刷新内容页面
    refreshNews();
  }

  @Override
  public boolean isTop() {
    //通过ScrollView.getScrollY()来判断是否位于顶部
    return mScrollView.getScrollY() == 0;
  }
  ... ...
}

这里之所以使用Appbar.setExpanded(true),是因为在这个页面中我使用了CoordinatorLayout + AppBarLayout + V7.Toolbar 的嵌套结构,在页面滚动的时候会自动隐藏toolbar,因此,会存在一个问题,如果不添加这行代码,ScrollView调用smoothScrollTo(0,0)toolbar并不会显示出来,这里要感谢知乎@郑大俊提出的方法,剩下的几个方法注释应该能容易看得到,就不多解释了。

最后,在BaseBottomDelegate中的tab底部导航栏的点击事件中实现如下代码即可:

public abstract class BaseBottomDelegate extends PocketDelegate 
        implements View.OnClickListener{
  ... ...
  @Override
  public void onClick(View view) {
    ... ...
    final int tag = (int) view.getTag();
    BottomItemDelegate currentDelegate = ITEM_DELEGATE.get(mCurrentDelegate);
    //如果已经选中当前页面,则再次点击滚动到顶部。
    if (tag == mCurrentDelegate) {
        //如果已经位于顶部,则刷新页面
        if (currentDelegate.isTop()){
            currentDelegate.onRefresh();
            return;
        }
        currentDelegate.onScrollToTop();
        return;
    }
    ... ...
    //隐藏当前fragment显示点击的fragment
    getSupportDelegate().showHideFragment(ITEM_DELEGATE.get(tag), currentDelegate);
    //重置tag为当前所选中的fragment
    mCurrentDelegate = tag;
  }
  ... ...
}

这样,就实现了点击底部导航栏按钮实现返回顶部,再次点击实现刷新的功能了!😄

相关文章

  • 安卓实现点击底部导航栏返回顶部&刷新功能

    现在的app几乎都是伴随着底部导航栏,页面往往存在着ScrollView或者RecyclerView等可滑动的Vi...

  • 屏幕边缘侧滑返回手势 UIScreenEdgePanGestur

    由于iPhone不像安卓手机那样底部有返回键可以点击返回上个页面,每次返回上一页都需要点击页面的导航栏返回按钮,这...

  • uni-app导航栏+swiper,及处理滑动冲突

    第一部分:swiper + 顶部/底部导航栏实现 这里的思想与安卓的fragment+viewpager是很类似的...

  • 特大新闻

    导航库React Navigation 功能:1.跳转页面 2.底部导航栏 3.顶部导航栏...

  • 参考笔记

    导航库React Navigation 功能:1.跳转页面 2.底部导航栏 3.顶部导航栏...

  • 12. 底部导航栏

    1. 底部导航栏 底部导航栏,是每个APP必备的组件,今天就来实现整个功能,当点击选项的时候,可以切换上面的页面 ...

  • pager-bottom-tab-strip

    一个基本按谷歌Material Design规范完成的安卓底部导航栏控件。 ViewPager+自定义的底部导航栏...

  • Android_底部导航栏(Cover 百度汉语)

    底部导航栏和侧滑栏现在在安卓应用中是二分天下的局面呀,就我而言,还是比较喜欢底部导航栏的,我们写底部导航栏方式可以...

  • 08-首页

    学习内容 类目Icon功能 底部猜你喜欢 上拉加载更多 下拉刷新 尾部视图处理 自定义顶部标签导航栏 根据网络数据...

  • [0.57]ReactNative-仿写Github客户端[二]

    目标:1.实现顶部导航动态配置功能,可滑动,设置相关样式,可传递参数。2.实现底部标签栏动态配置功能,可进行主题切...

网友评论

      本文标题:安卓实现点击底部导航栏返回顶部&刷新功能

      本文链接:https://www.haomeiwen.com/subject/hzvsxqtx.html