Flutter视频缓存插件cached_s5_video的使用
Flutter视频缓存插件cached_s5_video的使用
cached_s5_video
是一个用于S5 CID的简单视频缓存提供器。

使用说明
⚠️ 由于当前S5 Dart库的状态,整个视频将被缓存在内存中。因此,在此问题解决之前,不要使用大视频文件。
查看示例。
这是一个基于s5构建的库。更多详情请参阅该库。
基本用法:
Widget cachedS5Video = CachedS5Video(
cid: cid, // 字符串
s5: s5, // 参见 https://pub.dev/packages/s5
);
认可
这项工作得到了Sia基金会的资助。
完整示例代码
import 'package:cached_s5_manager/cached_s5_manager.dart';
import 'package:cached_s5_video/cached_s5_video.dart';
import 'package:cached_s5_video_example/src/s5.dart';
import 'package:flutter/material.dart';
import 'package:logger/logger.dart';
import 'package:media_kit/media_kit.dart';
import 'package:s5/s5.dart';
void main() {
// 重要:不要忘记复制这些行
WidgetsFlutterBinding.ensureInitialized();
MediaKit.ensureInitialized();
runApp(const CachedS5ImageDemo());
}
class CachedS5ImageDemo extends StatelessWidget {
const CachedS5ImageDemo({super.key});
// 这个小部件是您的应用的根。
[@override](/user/override)
Widget build(BuildContext context) {
return const MaterialApp(
title: 'Cached S5 Image Demo',
home: Demo(),
);
}
}
class Demo extends StatefulWidget {
const Demo({super.key});
[@override](/user/override)
State<Demo> createState() => _DemoState();
}
class _DemoState extends State<Demo> {
String? cid;
final TextEditingController _cidController = TextEditingController(
text: "z2H7M3Jipku7Qnt9dpAvFcsHskGewLZqAn9LiSXCVFEqy6aKcTTP");
S5? s5;
Logger logger = Logger();
CachedS5Manager? cacheManager;
[@override](/user/override)
void initState() {
_initS5();
_initCache();
super.initState();
}
void _initCache() async {
cacheManager?.init();
}
void _initS5() async {
// 这是一个示例S5节点,使用您自己的以获得最佳性能
s5 = await initS5("https://s5.jptr.tech", "hive", null);
cacheManager = CachedS5Manager(s5: s5!);
setState(() {}); // 更新UI
}
void _submitCID() async {
if (s5 != null) {
setState(() {
cid = _cidController.text;
});
}
}
void _clearCache() async {
cacheManager?.clear();
}
void _clearImage() async {
setState(() {
cid = null;
});
}
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
children: [
Row(
children: [
const Text("S5状态:"),
(s5 == null)
? const CircularProgressIndicator()
: const Icon(Icons.check),
],
),
TextField(
controller: _cidController,
decoration: const InputDecoration(labelText: "CID: z2..."),
),
const SizedBox(
height: 10,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
onPressed: _submitCID, child: const Text("提交CID")),
ElevatedButton(
onPressed: _clearCache, child: const Text("清除缓存")),
ElevatedButton(
onPressed: _clearImage,
child: const Text("清除加载的图像"))
],
),
const SizedBox(
height: 10,
),
AnimatedSwitcher(
duration: const Duration(milliseconds: 300),
child: (cid != null && s5 != null)
? CachedS5Video(
cid: cid!,
s5: s5!,
cacheManager: cacheManager,
)
: Container(),
),
],
),
);
}
}
更多关于Flutter视频缓存插件cached_s5_video的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
1 回复
更多关于Flutter视频缓存插件cached_s5_video的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然,以下是如何在Flutter项目中使用cached_s5_video
插件的一个示例。cached_s5_video
是一个用于视频缓存和播放的Flutter插件,它基于chewie
和video_player
插件,并添加了视频缓存功能。
首先,你需要在pubspec.yaml
文件中添加依赖:
dependencies:
flutter:
sdk: flutter
cached_s5_video: ^最新版本号 # 请替换为最新的版本号
chewie: ^最新版本号 # 因为cached_s5_video依赖于chewie,所以也需要添加
video_player: ^最新版本号 # 同样,video_player也是必需的
然后,运行flutter pub get
来安装这些依赖。
接下来,在你的Flutter项目中,你可以使用以下代码来缓存和播放视频:
import 'package:flutter/material.dart';
import 'package:cached_s5_video/cached_s5_video.dart';
import 'package:chewie/chewie.dart';
import 'package:video_player/video_player.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Video Cache Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: VideoScreen(),
);
}
}
class VideoScreen extends StatefulWidget {
@override
_VideoScreenState createState() => _VideoScreenState();
}
class _VideoScreenState extends State<VideoScreen> {
CachedVideoPlayerController? _controller;
ChewieController? _chewieController;
@override
void initState() {
super.initState();
_initializeVideoPlayer();
}
Future<void> _initializeVideoPlayer() async {
// 替换为你的视频URL
String videoUrl = 'https://www.example.com/your-video.mp4';
_controller = CachedVideoPlayerController.network(videoUrl);
// 初始化视频控制器
await _controller!.initialize();
// 创建Chewie控制器
setState(() {
_chewieController = ChewieController(
videoPlayerController: _controller!,
aspectRatio: _controller!.value.aspectRatio,
autoPlay: false,
looping: false,
);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Video Cache Demo'),
),
body: Center(
child: _controller!.value.isInitialized
? AspectRatio(
aspectRatio: _controller!.value.aspectRatio,
child: Chewie(
controller: _chewieController!,
),
)
: Container(
child: CircularProgressIndicator(),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
// 释放资源
_disposeControllers();
},
tooltip: 'Dispose',
child: Icon(Icons.close),
),
);
}
@override
void dispose() {
_disposeControllers();
super.dispose();
}
void _disposeControllers() {
_controller?.dispose();
_chewieController?.dispose();
}
}
在这个示例中,我们做了以下几件事:
- 在
pubspec.yaml
中添加了必要的依赖。 - 创建了一个
VideoScreen
页面,其中包含视频播放器。 - 使用
CachedVideoPlayerController.network
方法从网络加载视频。 - 使用
Chewie
控件来显示视频播放器,并处理播放控制。 - 在
dispose
方法中释放了控制器资源。
请确保将videoUrl
替换为你想要播放的视频的实际URL。另外,请注意检查cached_s5_video
、chewie
和video_player
插件的最新版本,并根据需要进行更新。