native_video_view 0.2.1

  • Readme
  • Changelog
  • Example
  • Installing
  • 91

native_video_view #

A video player widget displayed using the platform native player (VideoView in Android and AVPlayer in iOS).

example_gif

Disclaimer #

This plugin uses VideoView because in some devices the ExoPlayer plugin is not working correctly (due to decoders or something) and VideoView is a reasonable alternative. In iOS is sorta similar to Google's video_player so you should use their plugin if you want a player for iOS only.

Installation #

First you need to add the dependency in your pubspec.yaml.

native_video_view: ^0.1.8

Then import the plugin in the .dart file you want to use it.

import 'package:native_video_view/native_video_view.dart';

Android #

You need to add the necessary permissions to play the videos. If you are playing videos from the internet, you need to add the internet permissions in your AndroidManifest.xml located in the android folder in your project.

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

If you are going to play videos from the device storage, you need to add the storage permissions.

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

iOS #

In this platform you need to configure some options in your Info.plist file. This file is located in <project-root>/ios/Runner/ Info.plist.

First add the embedded views configuration.

<key>io.flutter.embedded_views_preview</key>
<true/>

If you want to play videos from the internet add the following.

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

Usage #

This plugin has a widget to use in your dart files. Example:

@override
Widget build(BuildContext context) {
return Scaffold(
    appBar: AppBar(
    title: const Text('Plugin example app'),
    ),
    body: Container(
    alignment: Alignment.center,
    child: NativeVideoView(
        keepAspectRatio: true,
        showMediaController: true,
        onCreated: (controller) {
          controller.setVideoSource(
            'assets/example.mp4',
            sourceType: VideoSourceType.asset,
          );
        },
        onPrepared: (controller, info) {
          controller.play();
        },
        onError: (controller, what, extra, message) {
          print('Player Error ($what | $extra | $message)');
        },
        onCompletion: (controller) {
          print('Video completed');
        },
        onProgress: (progress, duration) {
          print('$progress | $duration');
        },
      ),
    ),
  );
}

keepAspectRatio: Wraps the video player in a AspectRatio widget. The aspect ratio is calculated once the video is loaded. By default the aspect ratio is 4/3.

showMediaController: Shows a default media controller overlay in the video player widget.

useExoPlayer: Use ExoPlayer as the underlying player. Android Only.

autoHide: Automatically hides the media controller after a few seconds of no use. Default is true.

autoHideTime: The time after which the controller is hidden. Default is 2 seconds.

onCreated: (required) Callback called when the PlatformView is finished creating.

onPrepared: (required) Callback called when the player has finished loading the video.

onCompletion: (required) Callback called when the video reached the end.

onError: Callback called if an error occurs in the player.

onProgress: Callback used to notify progress in the video playback.

Changelog #

0.2.1 #

  • Added memory leak fix for iOS. Thanks to @mentalmap

0.1.9 #

  • Fixed swift kCMTimeZero crash. Changed kCMTimeZero to CMTime.zero. (Thanks to @ngocdtph03070)
  • Updated path_provider dependency.

0.1.8 #

  • Added an ExoPlayer controller for Android. This option can be set when creating the widget.

0.1.4 #

  • Improved Android dispose mechanism.
  • Added controller dispose method.
  • Fixes in temp file lifecycle.

0.1.3 #

  • Removed flutter.jar dependency in build.gradle

0.1.2 #

  • Added a better description in pubspec.yaml

0.1.1 #

  • Removed conflicting file in iOS folder

0.1.0 #

  • Widget to play videos.
  • Media controls widget.
  • Callbacks to control the state of the player.
  • Use of platform view to display the player in each platform.

example/lib/main.dart

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

void main() => runApp(MaterialApp(home: MyApp()));

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Plugin example app'),
      ),
      body: _buildVideoPlayerWidget(),
    );
  }

  Widget _buildVideoPlayerWidget() {
    return Container(
      alignment: Alignment.center,
      child: NativeVideoView(
        keepAspectRatio: true,
        showMediaController: true,
        onCreated: (controller) {
          controller.setVideoSource(
            'assets/example.mp4',
            sourceType: VideoSourceType.asset,
          );
        },
        onPrepared: (controller, info) {
          controller.play();
        },
        onError: (controller, what, extra, message) {
          print('Player Error ($what | $extra | $message)');
        },
        onCompletion: (controller) {
          print('Video completed');
        },
      ),
    );
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  native_video_view: ^0.2.1

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:native_video_view/native_video_view.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
81
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
91
Learn more about scoring.

We analyzed this package on Jun 4, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.8.2
  • pana: 0.13.8-dev
  • Flutter: 1.17.1

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.7.0 <3.0.0
flutter 0.0.0
path_provider ^1.6.5 1.6.10
Transitive dependencies
collection 1.14.12
file 5.1.0
intl 0.16.1
meta 1.1.8
path 1.7.0
path_provider_linux 0.0.1+1
path_provider_macos 0.0.4+3
path_provider_platform_interface 1.0.2
platform 2.2.1
plugin_platform_interface 1.0.2
process 3.0.13
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
xdg_directories 0.1.0
Dev dependencies
flutter_test