2023面试高手

这个屌丝很懒，什么也没留下！

热门标签

【Android入门到项目实战-- 11.4】—— ExoPlayer视频播放器框架的详细使用

作者：2023面试高手 | 2024-03-23 14:30:16

踩

exoplayer

什么是ExoPlayer

ExoPlayer是由Google开发的媒体播放器库，支持播放本地和网络视频。以下是使用ExoPlayer播放视频的详细步骤和代码示例。

一、基本使用

下面实现如下图所示的两个播放器的效果：

1、添加依赖项

build.gradle添加：


implementation 'com.google.android.exoplayer:exoplayer-core:2.15.1'  
implementation 'com.google.android.exoplayer:exoplayer-ui:2.15.1'

声明网络权限

    <uses-permission android:name="android.permission.INTERNET" />

2、布局


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
 
    <com.google.android.exoplayer2.ui.PlayerView
        android:id="@+id/player_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>
 
 
    <com.google.android.exoplayer2.ui.PlayerView
        android:id="@+id/player_view2"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"/>
 
 
</LinearLayout>

3、Activity


public class MainActivity extends AppCompatActivity {
    private SimpleExoPlayer mPlayer;
    private SimpleExoPlayer mPlayer2;
    private PlayerView mPlayerView;
    private PlayerView mPlayerView2;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        mPlayerView = findViewById(R.id.player_view);
        mPlayerView2 = findViewById(R.id.player_view2);
 
        // 创建媒体播放器
        mPlayer = new SimpleExoPlayer.Builder(this).build();
        mPlayer2 = new SimpleExoPlayer.Builder(this).build();
        mPlayerView.setPlayer(mPlayer);
        mPlayerView2.setPlayer(mPlayer2);
 
 
        // 设置数据源
        String videoUrl = "https://v2.kwaicdn.com/upic/2023/04/14/13/BMjAyMzA0MTQxMzA3MDhfNDgwOTQ5MTg2XzEwMDU1NzkwNjgxMV8yXzM=_b_B4856a8b07ea4dbc4ad503f04681b5ec8.mp4?pkey=AAW-JkY6q-BoTEXl2FArO1ReMGt965IaFcPl0NGX7cYTVhLtgZVdld15RtYUAWwkkEmBjjKBPE2yDFb0kigIji2xGTYcxXU-rCTrXNQiN4N4_RpUja5SPyx99Eh46Cixcag&tag=1-1684724589-unknown-0-0eoiahcqin-0a0841bce7d498e5&clientCacheKey=3xt93xmd7emzv6k_b.mp4";
        String videoUrl2 = "https://v2.kwaicdn.com/upic/2023/05/20/16/BMjAyMzA1MjAxNjAyMjhfMTM2MDg5NzAyNl8xMDM1MjIwNDgzMjFfMl8z_b_B0d97abd06757be9906cd83e0571dcd7d.mp4?pkey=AAX4DgH_Q4KBjVVQpeITMyNxi34_0KOD7Dp80qxpwuNV4BfONaasSnAkBrFPEdGKbfj0m9Jd_VGG-isTQxiQGOlUQ6e2OKuPO2f72pFUVdxdEJkqCVpijL4zsJu3mMtoBfc&tag=1-1684724589-unknown-0-hilddj6arr-772b90a0f590e795&clientCacheKey=3xhd9ng5fbii652_b.mp4";
        MediaItem mediaItem = MediaItem.fromUri(videoUrl);
        MediaItem mediaItem2 = MediaItem.fromUri(videoUrl2);
        mPlayer.setMediaItem(mediaItem);
        mPlayer2.setMediaItem(mediaItem2);
        mPlayer.prepare();
        mPlayer2.prepare();
 
 
    }
 
//        以下是生命周期管理
    @Override
    protected void onStart() {
        super.onStart();
        mPlayerView.onResume();
    }
 
    @Override
    protected void onStop() {
        super.onStop();
        mPlayerView.onPause();
    }
 
    @Override
    protected void onDestroy() {
        super.onDestroy();
        mPlayer.release();
    }
 
//        注意：在使用ExoPlayer时，需要在Activity中保持屏幕常亮以避免视频播放过程中屏幕自动关闭。
    @Override
    protected void onResume() {
        super.onResume();
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
    }
 
    @Override
    protected void onPause() {
        super.onPause();
        getWindow().clearFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
    }
}

二、自定义播放暂停

1、首先如何隐藏默认的开始暂停和快进？

隐藏它们很简单，只需把use_controller设置成false即可。


<com.google.android.exoplayer2.ui.StyledPlayerView
        android:id="@+id/videoView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        app:use_controller="false"/>

2、自定义

ExoPlayer还提供了很多控制视频播放的API，如暂停、继续、快进、快退、调整音量、调整亮度等。下面将介绍如何实现视频的暂停和继续播放。

在Activity中添加下面的代码：


private boolean isPlaying = false;
 
private void togglePlay() {
    if (isPlaying) {
        player.pause();
    } else {
        player.play();
    }
    isPlaying = !isPlaying;
}

利用isPlaying布尔变量记录当前视频的播放状态，使用player.pause()方法暂停视频，使用player.play()方法继续播放视频，并且通过isPlaying变量更新当前播放状态。

在SimpleExoPlayerView中添加点击事件：


playerView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        togglePlay();
    }
});

这样就可以实现通过点击视频区域来暂停和继续视频的播放。

三、控制视频画面旋转和比例调整

xoPlayer支持旋转视频画面和调整视频比例的功能。下面将介绍如何使用ExoPlayer来实现这些功能。

使用代码旋转视频画面，可以调用SimpleExoPlayerView.setUseController(false)方法隐藏内置的控制器，然后利用下面的代码实现视频旋转：

playerView.setKeepScreenOn(true);
playerView.setRotation(90);
playerView.setResizeMode(AspectRatioFrameLayout.RESIZE_MODE_FIT);

通过playerView.setKeepScreenOn(true)方法保持屏幕常亮，playerView.setRotation(90)方法实现视频的旋转，playerView.setResizeMode(AspectRatioFrameLayout.RESIZE_MODE_FIT)方法调整视频的比例。

四、全屏放大和缩小

实现视频画面的缩放，可以通过以下代码实现：


private boolean isFullscreen = false;
 
private void toggleFullscreen() {
    if (isFullscreen) {
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
        getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
        playerView.setResizeMode(AspectRatioFrameLayout.RESIZE_MODE_FIT);
        getSupportActionBar().show();
    } else {
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
        playerView.setResizeMode(AspectRatioFrameLayout.RESIZE_MODE_FILL);
        getSupportActionBar().hide();
    }
    isFullscreen = !isFullscreen;
}

利用isFullscreen布尔变量记录当前是否全屏状态，使用setRequestedOrientation()方法实现屏幕的旋转，使用getWindow().addFlags()和getWindow().clearFlags()方法实现全屏状态的切换，并且使用playerView.setResizeMode()方法调整视频的比例。在全屏状态下隐藏ActionBar，退出全屏状态后显示ActionBar。

1、双击视频放大缩小

在SimpleExoPlayerView中添加双击事件：


playerView.setOnTouchListener(new View.OnTouchListener() {
    private GestureDetector gestureDetector = new GestureDetector(MainActivity.this,
            new GestureDetector.SimpleOnGestureListener() {
                @Override
                public boolean onDoubleTap(MotionEvent e) {
                    toggleFullscreen();
                    return super.onDoubleTap(e);
                }
            });
 
    @Override
    public boolean onTouch(View view, MotionEvent motionEvent) {
        gestureDetector.onTouchEvent(motionEvent);
        return true;
    }
});

这样就可以实现在双击视频区域时切换视频的全屏状态。

2、按钮放大缩小


        mBtnZoom.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                toggleFullscreen();
            }
       });

五、完整的实现代码

如果看不懂前面的操作，可以直接用下面的代码，有点击按钮和双击视频全屏放大缩小效果。

XML


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
 
    <com.google.android.exoplayer2.ui.PlayerView
        android:id="@+id/player_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
 
    <Button
        android:id="@+id/btn_zoom"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_margin="16dp"
        android:backgroundTint="@color/white"
        android:text="Full Screen"
        android:textColor="@color/black"
        android:visibility="visible"
        android:onClick="onFullscreenButtonClick"/>
 
 
</RelativeLayout>

Activity


public class MainActivity extends AppCompatActivity {
    private SimpleExoPlayer mPlayer;
    private PlayerView mPlayerView;
    private Button mBtnZoom;
    private boolean isFullscreen = false;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        mPlayerView = findViewById(R.id.player_view);
        mBtnZoom = findViewById(R.id.btn_zoom);
 
//         创建媒体播放器
        mPlayer = new SimpleExoPlayer.Builder(this).build();
        mPlayerView.setPlayer(mPlayer);
 
//        准备视频源
        String videoUrl = "https://v2.kwaicdn.com/upic/2023/04/14/13/BMjAyMzA0MTQxMzA3MDhfNDgwOTQ5MTg2XzEwMDU1NzkwNjgxMV8yXzM=_b_B4856a8b07ea4dbc4ad503f04681b5ec8.mp4?pkey=AAW-JkY6q-BoTEXl2FArO1ReMGt965IaFcPl0NGX7cYTVhLtgZVdld15RtYUAWwkkEmBjjKBPE2yDFb0kigIji2xGTYcxXU-rCTrXNQiN4N4_RpUja5SPyx99Eh46Cixcag&tag=1-1684724589-unknown-0-0eoiahcqin-0a0841bce7d498e5&clientCacheKey=3xt93xmd7emzv6k_b.mp4";
        String videoUrl2 = "https://v2.kwaicdn.com/upic/2023/05/20/16/BMjAyMzA1MjAxNjAyMjhfMTM2MDg5NzAyNl8xMDM1MjIwNDgzMjFfMl8z_b_B0d97abd06757be9906cd83e0571dcd7d.mp4?pkey=AAX4DgH_Q4KBjVVQpeITMyNxi34_0KOD7Dp80qxpwuNV4BfONaasSnAkBrFPEdGKbfj0m9Jd_VGG-isTQxiQGOlUQ6e2OKuPO2f72pFUVdxdEJkqCVpijL4zsJu3mMtoBfc&tag=1-1684724589-unknown-0-hilddj6arr-772b90a0f590e795&clientCacheKey=3xhd9ng5fbii652_b.mp4";
        MediaItem mediaItem = MediaItem.fromUri(videoUrl);
        MediaItem mediaItem2 = MediaItem.fromUri(videoUrl2);
        mPlayer.setMediaItem(mediaItem);
        mPlayer.prepare();
 
 
//        按钮放大缩小
        mBtnZoom.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                toggleFullscreen();
            }
        });
 
 
//        双击视频放大缩小
        mPlayerView.setOnTouchListener(new View.OnTouchListener() {
            private GestureDetector gestureDetector = new GestureDetector(MainActivity.this,
                    new GestureDetector.SimpleOnGestureListener() {
                        @Override
                        public boolean onDoubleTap(MotionEvent e) {
                            toggleFullscreen();
                            return super.onDoubleTap(e);
                        }
                    });
 
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                gestureDetector.onTouchEvent(motionEvent);
                return true;
            }
        });
 
 
    }
 
 
 
//    视频放大缩小方法
    private void toggleFullscreen() {
        if (isFullscreen) {
            setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
            getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
            mPlayerView.setResizeMode(AspectRatioFrameLayout.RESIZE_MODE_FIT);
            getSupportActionBar().show();
        } else {
            setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
            getWindow().addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
            mPlayerView.setResizeMode(AspectRatioFrameLayout.RESIZE_MODE_FILL);
            getSupportActionBar().hide();
        }
        isFullscreen = !isFullscreen;
    }
 
 
//    以下是生命周期
    @Override
    protected void onStart() {
        super.onStart();
        mPlayerView.onResume();
    }
 
    @Override
    protected void onStop() {
        super.onStop();
        mPlayerView.onPause();
    }
 
    @Override
    protected void onDestroy() {
        super.onDestroy();
        mPlayer.release();
    }
 
 
//    注意：在使用ExoP注意：在使用ExoPlayer时，需要在Activity中保持屏幕常亮以避免视频播放过程中屏幕自动关闭。layer时，需要在Activity中保持屏幕常亮以避免视频播放过程中屏幕自动关闭。
    @Override
    protected void onResume() {
        super.onResume();
        getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
    }
 
    @Override
    protected void onPause() {
        super.onPause();
        getWindow().clearFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON);
    }
}

最后不要忘记添加网络权限！

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/2023面试高手/article/detail/295745