Flutter 视频video_player与缓存flutter_cache_manager

这里写自定义目录标题

    • [1. 依赖](#1. 依赖)
    • [2. 缓存flutter_cache_manager](#2. 缓存flutter_cache_manager)
    • [3. 视频video_player](#3. 视频video_player)

1. 依赖

dart 复制代码
  video_player: ^2.6.0
  flutter_cache_manager: ^3.3.1

2. 缓存flutter_cache_manager

参考官方DefaultCacheManager代码,这里引入Config可以指定天数与最大个数.

文件名 video_cache.dart

dart 复制代码
import 'package:flutter_cache_manager/flutter_cache_manager.dart';

/// The DefaultCacheManager that can be easily used directly. The code of
/// this implementation can be used as inspiration for more complex cache
/// managers.
class MyDefaultCacheManager extends CacheManager with ImageCacheManager {
  static const key = 'libCachedImageData';

  static final MyDefaultCacheManager _instance = MyDefaultCacheManager._();

  factory MyDefaultCacheManager() {
    return _instance;
  }

  MyDefaultCacheManager._()
      : super(Config(
          key,
          stalePeriod: const Duration(days: 7),
          maxNrOfCacheObjects: 20,
          repo: JsonCacheInfoRepository(databaseName: key),
          fileService: HttpFileService(),
        ));
}

3. 视频video_player

使用 await MyDefaultCacheManager().getSingleFile(url)) 即可

dart 复制代码
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
import 'video_cache.dart';

// main.dart可以打开
// void main() {
//   runApp(MyApp());
// }

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late VideoPlayerController controller;
  bool isInitController = false;
  List mediaList = [
    {'type': 'video', 'url': 'https://static.ybhospital.net/test-video-10.MP4'},
    {
      'type': 'image',
      'url': 'https://img-home.csdnimg.cn/images/20230817060240.png'
    },
    {'type': 'video', 'url': 'https://static.ybhospital.net/test-video-6.mp4'},
    {'type': 'video', 'url': 'https://static.ybhospital.net/test-video-4.mp4'}
  ];
  int index = 0;

  @override
  void initState() {
    super.initState();
    initController();
  }

  initController() async {
    isInitController = false;
    controller = VideoPlayerController.file(
        await MyDefaultCacheManager().getSingleFile(mediaList[index]['url']))
      ..initialize().then((_) {
        setState(() {
          isInitController = true;
        });
        controller.addListener(_videoListener);
        controller.play();
      });
  }

  @override
  void dispose() {
    if (isInitController != false) {
      controller.removeListener(_videoListener);
      controller.dispose();
    }

    super.dispose();
  }

  _videoListener() {
    if (isInitController == false) return;

    if (controller.value.position == controller.value.duration) {
      next();
    }
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Video Player Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        body: Center(
          child: Container(
            child: mediaList[index]['type'] == 'video'
                ? (isInitController
                    ? AspectRatio(
                        aspectRatio: controller.value.aspectRatio,
                        child: VideoPlayer(controller),
                      )
                    : Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: const [
                          CircularProgressIndicator(),
                          SizedBox(height: 20),
                          Text('Loading'),
                        ],
                      ))
                : Image.network(mediaList[index]['url']),
          ),
        ),
      ),
    );
  }

  next() {
    setState(() {
      if (isInitController != false && controller.value.isInitialized) {
        isInitController = false;
        controller.removeListener(_videoListener);
        controller.dispose();
      }

      index++;
      if (index >= mediaList.length) {
        index = 0;
      }

      if (mediaList[index]['type'] == 'video') {
        initController();
      } else {
        Future.delayed(Duration(seconds: 10), next);
      }
    });
  }

  void prev() {
    setState(() {
      if (index > 0) {
        index--;
      } else {
        index = mediaList.length - 1;
      }

      if (mediaList[index]['type'] == 'video') {
        initController();
      } else {
        Future.delayed(Duration(seconds: 10), next);
      }
    });
  }
}
相关推荐
材料苦逼不会梦到计算机白富美2 小时前
golang分布式缓存项目 Day 1
分布式·缓存·golang
Java 第一深情2 小时前
高性能分布式缓存Redis-数据管理与性能提升之道
redis·分布式·缓存
HBryce243 小时前
缓存-基础概念
java·缓存
EasyCVR3 小时前
EHOME视频平台EasyCVR视频融合平台使用OBS进行RTMP推流,WebRTC播放出现抖动、卡顿如何解决?
人工智能·算法·ffmpeg·音视频·webrtc·监控视频接入
冷凝女子6 小时前
【QT】海康视频及openCv抓拍正脸接口
qt·opencv·音视频·海康
安步当歌7 小时前
【WebRTC】视频编码链路中各个类的简单分析——VideoStreamEncoder
音视频·webrtc·视频编解码·video-codec
顾北川_野7 小时前
Android CALL关于电话音频和紧急电话设置和获取
android·音视频
顶呱呱程序7 小时前
2-143 基于matlab-GUI的脉冲响应不变法实现音频滤波功能
算法·matlab·音视频·matlab-gui·音频滤波·脉冲响应不变法
EasyCVR8 小时前
萤石设备视频接入平台EasyCVR多品牌摄像机视频平台海康ehome平台(ISUP)接入EasyCVR不在线如何排查?
运维·服务器·网络·人工智能·ffmpeg·音视频