Flutter视频播放插件lykluk_vlc_player的使用

Flutter视频播放插件lykluk_vlc_player的使用

lykluk_vlc_player 是一个基于VLC库的视频播放器插件，支持iOS和Android平台。相较于Flutter自带的video_player插件，它提供了更多的功能和更好的性能。

安装

iOS

如果你无法从外部源加载媒体文件，你需要在 Info.plist 文件中添加以下配置：

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key>
  <true/>
</dict>

确保在 <project root>/ios/Podfile 文件中的以下行未被注释：

platform :ios, '9.0'

为了启用外部显示器（如Chromecast）的VLC投射功能，你还需要添加以下配置：

<key>NSLocalNetworkUsageDescription</key>
<string>Used to search for chromecast devices</string>
<key>NSBonjourServices</key>
<array>
  <string>_googlecast._tcp</string>
</array>

Android

要从互联网加载媒体/字幕文件，你的应用需要 INTERNET 权限。这可以通过确保在 <project root>/android/app/src/main/AndroidManifest.xml 文件中包含以下权限声明来实现：

<uses-permission android:name="android.permission.INTERNET" />

如果遇到“Cleartext HTTP traffic to * is not permitted”的错误，你需要在 AndroidManifest.xml 文件中添加 android:usesClearTextTraffic="true" 标志，或者定义一个新的“网络安全性配置”文件。更多详情请参阅 https://developer.android.com/training/articles/security-config。

为了从内部设备存储加载媒体/字幕文件，你需要添加以下权限：

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>

在某些情况下，你还需要在 AndroidManifest.xml 文件的应用程序标签中添加 android:requestLegacyExternalStorage="true" 标志。之后你可以通过以下路径访问媒体/字幕文件：

"/storage/emulated/0/{FilePath}"
"/sdcard/{FilePath}"

Android构建配置

1. 在 android/app/build.gradle 文件中：

android {
    packagingOptions {
       // 解决重复库构建问题，当项目使用多个依赖于C++库的插件时。
        pickFirst 'lib/**/libc++_shared.so'
    }
   
   buildTypes {
      release {
         minifyEnabled true
         useProguard true
         proguardFiles getDefaultProguardFile(
                 'proguard-android-optimize.txt'),
                 'proguard-rules.pro'
      }
   }
}

1. 创建 android/app/proguard-rules.pro 文件，并添加以下行：

-keep class org.videolan.libvlc.** { *; }

Android多窗口支持

要在Android应用中启用多窗口支持，你需要在 AndroidManifest.xml 中为主活动添加 android:resizeableActivity 键，以及为应用程序添加 android.allow_multiple_resumed_activities 元数据：

<manifest ...>
  <application ...>
    <activity ...
      android:resizeableActivity="true">
      ...
    </activity>
    ...
    <meta-data
      android:name="android.allow_multiple_resumed_activities"
      android:value="true" />
  </application>
</manifest>

快速开始

要开始使用该插件，你可以复制以下代码或参考 flutter_vlc_player/example 示例项目：

import 'package:flutter/material.dart';
import 'package:flutter_vlc_player/vlc_player_flutter.dart';

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

class MyApp extends StatelessWidget {
  // 这个小部件是你的应用的根。
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);

  [@override](/user/override)
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  VlcPlayerController _videoPlayerController;

  Future<void> initializePlayer() async {}

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

    _videoPlayerController = VlcPlayerController.network(
      'https://media.w3.org/2010/05/sintel/trailer.mp4',
      hwAcc: HwAcc.FULL,
      autoPlay: false,
      options: VlcPlayerOptions(),
    );
  }

  [@override](/user/override)
  void dispose() async {
    super.dispose();
    await _videoPlayerController.stopRendererScanning();
    await _videoPlayerController.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(),
        body: Center(
          child: VlcPlayer(
            controller: _videoPlayerController,
            aspectRatio: 16 / 9,
            placeholder: Center(child: CircularProgressIndicator()),
          ),
        ));
  }
}