Flutter视频投屏插件video_cast的使用

Flutter视频投屏插件video_cast的使用

简介

video_cast 是一个用于在Chromecast设备上播放视频的Flutter插件。这是对 flutter_video_cast_v2 插件的修改版本，增加了额外的功能。

安装

首先，在你的 pubspec.yaml 文件中添加 video_cast 作为依赖项。

Android 配置

在你的模块（应用级别）Gradle文件（通常是 android/app/build.gradle）中添加以下依赖：

implementation 'com.google.android.gms:play-services-cast-framework:21.2.0'
implementation 'com.google.android.exoplayer:extension-cast:2.17.1'

在应用程序清单 android/app/src/main/AndroidManifest.xml 中将 MainActivity 的主题设置为 @style/Theme.AppCompat.NoActionBar：

<manifest ...
  <application ...
    <meta-data android:name="com.google.android.gms.cast.framework.OPTIONS_PROVIDER_CLASS_NAME"
               android:value="com.google.android.exoplayer2.ext.cast.DefaultCastOptionsProvider"/>
    ...
    <activity android:theme="@style/Theme.AppCompat.NoActionBar" ...

使 MainActivity 继承 FlutterFragmentActivity 并初始化 Cast 上下文：

CastContext.getSharedInstance(applicationContext)

使用 ChromeCastButton

你现在可以在小部件树中添加一个 ChromeCastButton 小部件。

按钮可以通过传递给 ChromeCastButton 的 onButtonCreated 回调中的 ChromeCastController 进行控制。

import 'package:flutter/material.dart';
import 'package:video_cast/video_cast.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: CastSample(),
    );
  }
}

class CastSample extends StatefulWidget {
  [@override](/user/override)
  _CastSampleState createState() => _CastSampleState();
}

class _CastSampleState extends State<CastSample> {
  ChromeCastController _controller;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Cast Sample'),
        actions: [
          ChromeCastButton(
            onButtonCreated: (controller) {
              setState(() => _controller = controller);
              _controller?.addSessionListener();
            },
            onSessionStarted: () {
                _controller?.loadMedia(
                url:
                    "https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4",
                position: 30000, // 开始位置为30秒
                autoplay: true,
                title: "Spider-Man: No Way Home",
                description:
                    "Peter Parker is unmasked and no longer able to separate his normal life from the high-stakes of being a super-hero. When he asks for help from Doctor Strange the stakes become even more dangerous, forcing him to discover what it truly means to be Spider-Man.",
                image:
                    "https://terrigen-cdn-dev.marvel.com/content/prod/1x/marvsmposterbk_intdesign.jpg",
                type: ChromeCastMediaType.movie,
              );
            },
          ),
        ],
      ),
    );
  }
}

完整示例代码

import 'package:flutter/material.dart';
import 'package:video_cast/chrome_cast_media_type.dart';
import 'package:video_cast/chrome_cast_subtitle.dart';
import 'package:video_cast/video_cast.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  ChromeCastController? castController;

  [@override](/user/override)
  void initState() {
    super.initState();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
        ),
        body: Center(
          child: Column(
            children: [
              const Text("ChromeCastButton"),
              const SizedBox(
                height: 5,
              ),
              ChromeCastButton(
                color: Colors.red, // 按钮颜色
                onButtonCreated: (controller) {
                  castController = controller;
                  castController?.addSessionListener(); // 添加会话监听器
                },
                onSessionEnding: (position) {
                  print("in app ending");
                  print("position is $position");
                },
                onSessionEnded: () {
                  print("in app ended");
                },
                onSessionStarted: () {
                  print("in app started");
                  castController?.onProgressEvent().listen((event) {
                    print("in app progress ${event.inMilliseconds}");
                  });
                  castController?.loadMedia(
                    url:
                        "https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4",
                    position: 30000, // 开始位置为30秒
                    autoplay: true,
                    title: "Spider-Man: No Way Home",
                    description:
                        "Peter Parker is unmasked and no longer able to separate his normal life from the high-stakes of being a super-hero. When he asks for help from Doctor Strange the stakes become even more dangerous, forcing him to discover what it truly means to be Spider-Man.",
                    image:
                        "https://terrigen-cdn-dev.marvel.com/content/prod/1x/marvsmposterbk_intdesign.jpg",
                    type: ChromeCastMediaType.movie,
                    subtitles: [
                      ChromeCastSubtitle(
                        id: 1,
                        language: "en-US",
                        name: "English",
                        source:
                            "https://cc.2cdns.com/3e/62/3e62d0109500abf55acf229a0599a20d/3e62d0109500abf55acf229a0599a20d.vtt",
                      ),
                      ChromeCastSubtitle(
                        id: 2,
                        language: "ar",
                        name: "Arabic",
                        source:
                            "https://cc.2cdns.com/91/bd/91bdc91ffff0906bd54f0711eb3e786f/91bdc91ffff0906bd54f0711eb3e786f.vtt",
                      ),
                    ],
                  );
                },
              ),
              ElevatedButton(
                onPressed: () {
                  castController?.setTrack(subId: 1); // 设置字幕轨道1
                },
                child: const Text("Set Track 1"),
              ),
              ElevatedButton(
                onPressed: () {
                  castController?.setTrack(subId: 2); // 设置字幕轨道2
                },
                child: const Text("Set Track 2"),
              ),
              ElevatedButton(
                onPressed: () {
                  castController?.disableTrack(); // 禁用字幕轨道
                },
                child: const Text("Disable Track"),
              ),
            ],
          ),
        ),
      ),
    );
  }

  [@override](/user/override)
  void dispose() {
    castController?.cancelTimer(); // 取消计时器
    super.dispose();
  }
}