【Android 进阶】仿抖音系列之翻页上下滑切换视频（一）

最新推荐文章于 2022-01-25 12:39:34 发布

欢子-3824

最新推荐文章于 2022-01-25 12:39:34 发布

阅读量8.8k

点赞数 3

CC 4.0 BY-SA版权

分类专栏：安卓开发文章标签：仿抖音翻页视频

本文链接：https://blog.csdn.net/qq_21138819/article/details/83028693

本文介绍如何在Android项目中实现类似抖音的上下滑动切换视频功能，通过重写ViewPager的触摸事件，利用Fragment生命周期管理视频播放与暂停。使用腾讯TXCloudVideoView播放器，并探讨了实现无限上滑的策略。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近公司在做个短视频的项目，其中借鉴了很多抖音的设计，其中就有抖音的上下滑切换视频。

先说下思路，这里用重写了ViewPager的onInterceptTouchEvent和onTouchEvent方法，使其可以上下滑动切换视图。

代码如下

/**
 * 作者： ch
 * 时间： 2018/7/30 0030-下午 2:53
 * 描述：
 * 来源：
 */


public class VerticalViewPager extends ViewPager {
   
   

    private boolean isVertical = false;

    public VerticalViewPager(@NonNull Context context) {
   
   
        super(context);
    }

    public VerticalViewPager(@NonNull Context context, @Nullable AttributeSet attrs) {
   
   
        super(context, attrs);
    }

    private void init() {
   
   
        // The majority of the magic happens here
        setPageTransformer(true, new HorizontalVerticalPageTransformer());
        // The easiest way to get rid of the over scroll drawing that happens on the left and right
        setOverScrollMode(OVER_SCROLL_NEVER);
    }


    public boolean isVertical() {
   
   
        return isVertical;
    }

    public void setVertical(boolean vertical) {
   
   
        isVertical = vertical;
        init();
    }

    private class HorizontalVerticalPageTransformer implements PageTransformer {
   
   

        private static final float MIN_SCALE = 0.75f;

        @Override
        public void transformPage(View page, float position) {
   
   
            if (isVertical) {
   
   

                if (position < -1) {
   
   
                    page.setAlpha(0);
                } else if (position <= 1) {
   
   
                    page.setAlpha(1);

                    // Counteract the default slide transition
                    float xPosition = page.getWidth() * -position;
                    page.setTranslationX(xPosition);

                    //set Y position to swipe in from top
                    float yPosition = position * page.getHeight();
                    page.setTranslationY(yPosition);
                } else {
   
   
                    page.setAlpha(0);
                }
            } else {
   
   
                int pageWidth = page.getWidth();

                if (position < -1) {
   
    // [-Infinity,-1)
                    // This page is way off-screen to the left.
                    page.setAlpha(0);

                } else if (position <= 0) {