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);
      }
    });
  }
}
相关推荐
栗子~~3 小时前
集成 jacoco 插件,查看单元测试覆盖率
缓存·单元测试·log4j
Fre丸子_6 小时前
ffmpeg之播放一个yuv视频
ffmpeg·音视频
9527华安6 小时前
FPGA多路MIPI转FPD-Link视频缩放拼接显示,基于IMX327+FPD953架构,提供2套工程源码和技术支持
fpga开发·架构·音视频
catmes7 小时前
设置浏览器声音或视频的自动播放策略
chrome·音视频·edge浏览器
jcLee959 小时前
Flutter/Dart:使用日志模块Logger Easier
flutter·log4j·dart·logger
杨德杰9 小时前
QT多媒体开发(一):概述
qt·音视频·多媒体
tmacfrank10 小时前
Flutter 异步编程简述
flutter
tmacfrank10 小时前
Flutter 基础知识总结
flutter
是十一月末10 小时前
Opencv实现图片和视频的加噪、平滑处理
人工智能·python·opencv·计算机视觉·音视频
叫我菜菜就好11 小时前
【Flutter_Web】Flutter编译Web第三篇(网络请求篇):dio如何改造方法,变成web之后数据如何处理
前端·网络·flutter