android VideoView添加缓冲进度条

原创

mob64ca12d0371b 2024-09-21 05:57:26 ©著作权

文章标签 进度条 ide Android 文章分类 Android 移动开发

©著作权归作者所有：来自51CTO博客作者mob64ca12d0371b的原创作品，请联系作者获取转载授权，否则将追究法律责任

在Android的VideoView中添加缓冲进度条

在Android应用程序中播放视频时，我们常常需要处理网络延迟或视频文件大小不同所带来的缓冲问题。为了改善用户体验，添加一个缓冲进度条可以帮助用户了解视频的加载状态。本文将介绍如何在Android的VideoView中实现缓冲进度条。

1. VideoView简介

VideoView是Android SDK中的一个类，用于播放视频文件。它支持多种视频格式，且使用简便。然而，VideoView并未内置缓冲进度条，需要开发者手动实现。

2. 创建布局文件

首先，我们需要定义一个布局文件。布局中包含一个VideoView和一个ProgressBar，用于显示缓冲进度。以下是示例的XML布局代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <VideoView
        android:id="@+id/videoView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <ProgressBar
        android:id="@+id/progressBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true" />
</RelativeLayout>

3. 实现缓冲进度条

在Activity中，我们需要进行一些设置以实现缓冲进度条的效果。在下面的代码中，我们将监听VideoView的缓冲更新，并根据缓冲进度显示或隐藏ProgressBar。

import android.media.MediaPlayer;
import android.net.Uri;
import android.os.Bundle;
import android.widget.ProgressBar;
import android.widget.VideoView;
import androidx.appcompat.app.AppCompatActivity;

public class VideoActivity extends AppCompatActivity {
    private VideoView videoView;
    private ProgressBar progressBar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_video);

        videoView = findViewById(R.id.videoView);
        progressBar = findViewById(R.id.progressBar);

        String videoPath = " // 视频地址
        Uri uri = Uri.parse(videoPath);
        videoView.setVideoURI(uri);

        videoView.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
            @Override
            public void onPrepared(MediaPlayer mp) {
                progressBar.setVisibility(ProgressBar.GONE);
                mp.start();
            }
        });

        videoView.setOnInfoListener(new MediaPlayer.OnInfoListener() {
            @Override
            public boolean onInfo(MediaPlayer mp, int what, int extra) {
                if (what == MediaPlayer.MEDIA_INFO_BUFFERING_START) {
                    progressBar.setVisibility(ProgressBar.VISIBLE);
                } else if (what == MediaPlayer.MEDIA_INFO_BUFFERING_END) {
                    progressBar.setVisibility(ProgressBar.GONE);
                }
                return true;
            }
        });

        videoView.start();
    }
}

代码解析

布局文件：创建一个RelativeLayout，将VideoView和ProgressBar组合在一起。ProgressBar设置为居中显示。
VideoView设置：在Activity中，对VideoView进行设置，包括视频源的URI。
事件监听：
- OnPreparedListener：视频准备好后，隐藏进度条并开始播放。
- OnInfoListener：监听缓冲事件，显示或隐藏进度条。

4. 交互流程图

下图展示了用户打开应用并观看视频时的交互流程：

sequenceDiagram
    participant User
    participant App
    participant VideoView
    participant ProgressBar

    User->>App: 启动应用
    App->>VideoView: 设置视频源
    VideoView->>App: 准备视频
    App->>ProgressBar: 显示进度条
    VideoView->>User: 准备完成
    App->>ProgressBar: 隐藏进度条
    VideoView->>User: 播放视频

5. 进度条展示时长

为了更直观地说明进度条的展示时长，以下是甘特图来表示缓冲处理的时间。

gantt
    title 视频缓冲处理
    dateFormat  HH:mm:ss
    section 缓冲过程
    视频加载: active, 00:00:00, 00:00:05
    显示进度条: after video加载  , 00:00:03
    隐藏进度条: after 显示进度条 , 00:00:02