CoordinatorLayout使用AppBarLayout+ViewPager点击按钮回到顶部

如何写一个折叠布局
相信大部分人都会首先想到CoordinatorLayout
没错,使用CoordinatorLayout,然后再使用AppBarLayout很容易就能实现优雅的折叠布局

但是如果产品要你在右下角加一个按钮点击回到顶部呢,并且滑动到一定距离才会显示,默认不显示。
我最先想到的是ScrollView,但是很遗憾会滑动冲突,然后我尝试了重写onTouchEvent和onInterceptTouchEvent但是都不是很好。
最后放弃ScrollView,退而求其次实现了一个没有滚动效果的回到顶部(个人感觉很不优雅)

显示与隐藏

显示与隐藏这个很简单可以写一个View也可以使用一张图片,主要看你的需求
那么距离如何判断呢?
使用AppBarLayout的addOnOffsetChangedListener方法
直接上代码

mBinding.appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
            @Override
            public void onOffsetChanged(AppBarLayout appBarLayout, int verticalOffset) {
                if (verticalOffset >=0 ){
                    mBinding.toTop.setVisibility(View.GONE);
                }else {
                    mBinding.toTop.setVisibility(View.GONE);
                    if (verticalOffset < -1250){
                        mBinding.toTop.setVisibility(View.VISIBLE);
                    }
                }
            }
        });

判断verticalOffset的值就行了
最顶部的值是0,越往下滑值越小

回到顶部

滑动距离我们已经得出,那么只需要实现点击后的回到顶部就行了
使用AppBarLayout的behavior属性,详细只是建议另找大佬的文章学习,我就不多写了,免得暴露自己水平
直接看代码

ViewGroup.LayoutParams layoutParams = mBinding.appBarLayout.getLayoutParams();
            AppBarLayout.Behavior behavior = (AppBarLayout.Behavior) ((CoordinatorLayout.LayoutParams) layoutParams).getBehavior();
            if (behavior != null) {
                behavior.setTopAndBottomOffset(0);
                mBinding.toTop.setVisibility(View.GONE);
            }

最主要的就是这句behavior.setTopAndBottomOffset(0);
因为我是直接回到顶部,所以直接使用了0
如果你想回到某个组件的位置,在这句前面加上获取组件位置的代码

float y = mBinding.tvTop.getY();//获取组件的位置
behavior.setTopAndBottomOffset((int) -y);

然后就大功告成了
点击后会直接跳到顶部,没有过度过程
如果大佬有更好的方法欢迎评论指导下(非常感谢)

版权声明:
作者:主机优惠
链接:https://www.techfm.club/p/122418.html
来源:TechFM
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
< <上一篇
下一篇>>