与viewpager联动实现其他view平滑移动效果

GitHub: https://github.com/hnsugar/


核心代码
floatView.setX (positionOffset*floatView.getWidth () + tabLive.getX () + position * tabLive.getWidth ());
达到了viewpager平滑移动,上面浮动线也一起对应移动,代码就是这么简单。


详细说明
onPageScrolled 返回的参数
position:即将显示的位置,趋势
positionOffset:滑动百分比,滑动距离达到屏幕一般为50%,值在0-1之间
positionOffsetPixels:滑动像素距离,与设备屏幕像素有关

floatView.setX():指定浮动线view的横坐标
tabLive:直播、动态、主题是三个等大的view,floatview宽度也一致

思路:
1:floatview移动范围:直播下面和主题下面,最左边是直播View的
tabLive.getX (),最右边是
tabLive.getX ()加上3倍的直播View宽度。
2:滑动一个页面floatview移动范围:直播View的宽度。
3:计算从第一个到第二个:floatview的联动滑动距离与viewpager的滑动百分比有关,即viewpager滑到中间floatview也要在直播动态中间,移动距离为直播view左边加上floatview的宽度乘以滑动百分比,
positionOffset*floatView.getWidth () + tabLive.getX ();
4:其他位置滑动与position有关,加上
 position * tabLive.getWidth ()即可。
提示:
onPageScrolled 中的position为即将展现的位置,即从2滑到3,只要触发滑动position就会变成3(position值为2).
大概就是这么就完成了。






viewpage.addOnPageChangeListener (new ViewPager.OnPageChangeListener () {
    @Override
    public void onPageScrolled (final int position, final float positionOffset, final int positionOffsetPixels) {
        floatView.setX (positionOffset*floatView.getWidth () + tabLive.getX () + position * tabLive.getWidth ());
    }

    @Override
    public void onPageSelected (final int position) {
      
    }

    @Override
    public void onPageScrollStateChanged (final int state) {

    }
});
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值