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

来源:互联网 发布:康师傅 知乎 编辑:程序博客网 时间:2024/06/05 16:18
核心代码
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
原创粉丝点击