Flutter插件amphitheatre的介绍与使用

Flutter插件amphitheatre的介绍与使用

amphitheatre简介

amphitheatre 是一个用于 Flutter 的视频播放器和编辑器。它可以帮助开发者轻松实现视频播放与简单的编辑功能。

Amphitheatre	AmphitheatreEditor

* 注：出于平台通道实现的简单性，旧版本的支持可以按需实现。

快速开始

首先，确保你已经按照 video_player 包的设置步骤完成媒体播放环境的配置。

然后，你可以通过 Amphitheatre 构建视频播放器：

/// 启动一个带有视频播放器的新屏幕。
void showVideo({required final File myVideo}) {
  Amphitheatre.launch(
    context,
    controller: AmphitheatreController(
      controller: VideoPlayerController.file(myVideo),
      info: AmphitheatreVideoInfo(
        title: "视频标题",
        subtitle: "这是一个子标题。",
        description: "这是对视频的详细描述。Lorem ipsum dolor sit amet.",
      ),
    ),
  );
}

类似地，对于视频编辑器：

/// 启动一个带有视频编辑器的新屏幕。
///
/// 如果成功，返回编辑后的视频路径；如果失败或用户取消，则返回 null。
Future<String?> editVideo({required final File myVideo}) async {
  return await AmphitheatreEditor.launch(
    context,
    controller: AmphitheatreController(
      controller: VideoPlayerController.file(
        _chosenVideo!,
      ),
    ),
  );
}

你也可以选择使用 Amphitheatre.consume 或直接管理控制器，将 Amphitheatre 集成到自己的生命周期中。

多语言支持 (l10n)

该插件内置了对 flutter_localizations 的支持，并计划自动合并社区贡献的多语言翻译。如果你希望激活多语言支持，可以在 MaterialApp 中添加 AmphitheatreLocalization 委托：

void main() {
  runApp(
    MaterialApp(
      home: const MyAppHome(),
      debugShowCheckedModeBanner: false,
      
      // 添加本地化委托
      localizationsDelegates: [
        AmphitheatreLocalizations.delegate,
        ...GlobalMaterialLocalizations.delegates,
      ],
    ),
  );
}

示例代码

以下是一个完整的示例代码，展示如何在 Flutter 中使用 amphitheatre 插件：

import 'dart:io';

import 'package:amphitheatre/amphitheatre.dart';
import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:image_picker/image_picker.dart';
import 'package:video_player/video_player.dart';

void main() {
  runApp(
    MaterialApp(
      home: const MyAppHome(),
      debugShowCheckedModeBanner: false,
      localizationsDelegates: [
        AmphitheatreLocalizations.delegate,
        ...GlobalMaterialLocalizations.delegates,
      ],
    ),
  );
}

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

  [@override](/user/override)
  State<MyAppHome> createState() => _MyAppHomeState();
}

class _MyAppHomeState extends State<MyAppHome> {
  late final AmphitheatreController controller;

  File? _chosenVideo;

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      body: SizedBox.expand(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            FilledButton.tonal(
              child: Text(_chosenVideo != null
                  ? "替换视频..."
                  : "选择视频..."),
              onPressed: () async {
                final chosenFile = await ImagePicker().pickVideo(source: ImageSource.gallery);
                if (chosenFile == null) return;

                if (mounted) {
                  setState(() {
                    _chosenVideo = File(chosenFile.path);
                  });
                }
              },
            ),
            SizedBox(height: 10),
            if (_chosenVideo != null) ...[
              ElevatedButton(
                child: Text("打开视频播放器"),
                onPressed: () => Amphitheatre.launch(
                  context,
                  controller: AmphitheatreController(
                    controller: VideoPlayerController.file(
                      _chosenVideo!,
                    ),
                    info: AmphitheatreVideoInfo(
                      title: "视频标题",
                      subtitle: "这是一个子标题。",
                      description: "这是对视频的详细描述。Lorem ipsum dolor sit amet.",
                    ),
                  ),
                ),
              ),
              ElevatedButton(
                child: Text("打开视频编辑器"),
                onPressed: () async {
                  final editedVideoPath = await AmphitheatreEditor.launch(
                    context,
                    controller: AmphitheatreController(
                      controller: VideoPlayerController.file(
                        _chosenVideo!,
                      ),
                    ),
                  );

                  if (editedVideoPath != null) {
                    setState(() {
                      _chosenVideo = File(editedVideoPath);
                    });
                  }
                },
              ),
            ]
          ],
        ),
      ),
    );
  }
}