Flutter better_player: How to play video from local assets folder

Question

Q) Anyone know how to reference a file locally for both iOS and Android with better_player?

I cannot find a way to do this with their docs, I know it can be done with the in-house Flutter VideoPlayer plugin BUT I want to use better_player instead.

This works with the standard video plugin:

_videoController = VideoPlayerController.asset('assets/intro.mp4');

e.g. load a video in the project root at /assets/intro.mp4

I've tried this with better_player, but it doesn't find the file:

    BetterPlayerDataSource betterPlayerDataSource = BetterPlayerDataSource(
        BetterPlayerDataSourceType.file, "assets/sample.mp4");

@TirthPatel Thanks, I was not aware of that, looking at the github https://github.com/jhomlala/betterplayer/blob/master/example/lib/pages/welcome_page.dart - I can see how to do it now. — Dave, Jul 13 '21 at 13:59

score 2 · Answer 1 · answered Jul 14 '21 at 11:03

So first I had to copy the file to the ApplicationDocuments directory

  void _copyAssetToLocal() async {
    try {
      var content = await rootBundle.load("assets/intro.mp4");
      final directory = await getApplicationDocumentsDirectory();
      var file = File("${directory.path}/intro.mp4");
      file.writeAsBytesSync(content.buffer.asUint8List());
      _loadIntroVideo(file.path);
    } catch (e) {
      print("crap");
    }
  }

Then I could load it up from the new fullPath just created.

  void _loadIntroVideo(String fullPath) {
    var config = BetterPlayerConfiguration(
      fit: BoxFit.cover,
      autoPlay: true,
      fullScreenByDefault: false,
      // ...
    );

    BetterPlayerDataSource betterPlayerDataSource =
          BetterPlayerDataSource(BetterPlayerDataSourceType.file, fullPath);

    // etc
  }

score 0 · Answer 2 · answered Jul 13 '21 at 13:44

my example:

videoPage.dart

import 'package:better_player/better_player.dart';
import 'package:better_player_example/utils.dart';
import 'package:flutter/material.dart';

return Scaffold(
          appBar: AppBar(
            title: Text("better player example"),
          ),
          body: Column(
            children: [
              FutureBuilder<String>(
                future: Utils.getFileUrl("testvideo.mp4"),
                builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
                  if (snapshot.data != null) {
                    return BetterPlayer.file(snapshot.data!);
                  } else {
                    return const SizedBox();
                  }
                },
              )
            ],
          ),
        );

utils.dart

import 'package:path_provider/path_provider.dart';

class Utils {
  static Future<String> getFileUrl(String fileName) async {
    final directory = await getApplicationDocumentsDirectory();
    return "${directory.path}/$fileName";
  }
}

This is basically correct, except it omits the first part, which is to copy the file to the ApplicationDocumentsDirectory first, as per the example app in github. Thanks — Dave, Jul 13 '21 at 13:58

Flutter better_player: How to play video from local assets folder

2 Answers2