Flutter播放器含UI集成方案

1. 克隆仓库

   首先，克隆 aliplayer_widget_example 仓库到本地：

   cd aliplayer_widget_example

2. 安装依赖

   执行以下命令以安装项目所需的依赖：

   flutter pub get

3. 编译工程

   编译Android工程

   编译iOS工程

   如果您需要编译 Android 工程，请按照以下步骤操作：

   1. 确保已安装 Android SDK 和 Gradle。

   2. 执行以下命令生成 APK 文件：

      flutter build apk

   3. 编译完成后，APK 文件将位于build/app/outputs/flutter-apk/app-release.apk。

   如果您需要编译 iOS 工程，请按照以下步骤操作：

   1. 确保已安装 Xcode 和 CocoaPods。

   2. 初始化 CocoaPods 依赖：

      cd ios && pod install && cd ..

   3. 执行以下命令生成 iOS 应用包（IPA 文件）：

      flutter build ipa

   4. 编译完成后，IPA 文件将位于build/ios/ipa/Runner.ipa。

4. 运行示例

   • 运行Android示例

     flutter run lib/main.dart

   • 运行iOS示例

     cd ios && pod install && cd ..//运行前先pod install
     
     flutter run lib/main.dart

• 使用Android Studio

  1. 打开项目：

     启动Android Studio。选择 Open an Existing Project，然后导航到克隆的 aliplayer_widget_example 目录并打开。

  2. 安装依赖：

     在 Android Studio 中，点击 pubspec.yaml 文件，然后点击右上角的 Pub Get 按钮以安装依赖。

  3. 配置设备：

     确保已连接 Android 真机设备。

  4. 运行应用：

     点击工具栏中的绿色运行按钮（Run），选择目标设备后即可启动应用。

• 使用 VS Code

  1. 打开项目：

     启动 VS Code。选择 File -> Open Folder，然后导航到克隆的 aliplayer_widget_example 目录并打开。

  2. 安装依赖：

     打开终端（Ctrl + ~），运行以下命令以安装依赖：

     flutter pub get

  3. 配置设备：

     确保已连接 Android 或 iOS 真机设备。使用 VS Code 的设备选择器（左下角）选择目标设备。

  4. 运行应用：

     按下 F5 或点击左侧活动栏中的 Run and Debug 图标，选择 Flutter 配置并启动调试会话。

• 使用 Xcode（仅限 iOS）

  1. 打开项目：

     导航到 ios 目录，双击 Runner.xcworkspace 文件以在 Xcode 中打开项目。

  2. 安装 CocoaPods 依赖：

     如果尚未安装 CocoaPods 依赖，请在终端中运行以下命令：

     cd ios && pod install && cd ..

  3. 配置签名：

     在 Xcode 中，选择 Runner 项目，进入 Signing & Capabilities 标签页，配置有效的开发者账号和签名证书。

  4. 运行应用：

     点击 Xcode 工具栏中的运行按钮（▶️），选择目标设备后即可启动应用。

功能描述

当前页面展示如何使用 AliPlayerWidget 实现基础的点播视频播放功能。

运行效果

页面加载后自动播放指定的点播视频，并显示封面图和标题。用户可以通过控制栏进行暂停、快进、调整音量等操作。示例如下：

@override
void initState() {
  super.initState();
  _controller = AliPlayerWidgetController(context);
  final data = AliPlayerWidgetData(
    videoUrl: "https://example.com/sample-video.mp4",
    coverUrl: "https://example.com/sample-cover.jpg",
    videoTitle: "Sample Video Title",
  );
  _controller.configure(data);
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: AliPlayerWidget(_controller),
  );
}

功能描述

当前页面展示如何配置 AliPlayerWidget 以支持实时直播流媒体播放。

运行效果

页面加载后实时播放直播流，支持低延迟播放。用户可以在聊天窗口中查看消息并发送自己的评论。示例如下：

@override
void initState() {
  super.initState();
  _controller = AliPlayerWidgetController(context);
  final data = AliPlayerWidgetData(
    videoUrl: "https://example.com/live-stream.m3u8",
    sceneType: SceneType.live,
  );
  _controller.configure(data);
}

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Column(
      children: [
        Expanded(child: AliPlayerWidget(_controller)),
        _buildChatArea(),
        _buildMessageInput(),
      ],
    ),
  );
}