pod_player 0.1.0 icon indicating copy to clipboard operation
pod_player: ^0.1.0 copied to clipboard

Vimeo and youtube player for flutter, Pod player provides customizable video player controls that support android, ios and web.

pod_player

pub likes pub version popularity pub points

Video player for flutter web & mobile devices, pod player supports playing video from `Youtube` and `Vimeo`

pod player is a simple and easy-to-use video player. Its video controls are similar to Youtube player (with customizable controls) and also can play videos from Youtube and Vimeo (By providing url/video_id).

This plugin built upon flutter's official video_player plugin


PLATFORMAVAILABLE
Android
IOS
WEB

Features #

  • Play youtube videos (using video URL or ID)
  • Play vimeo videos (using video ID)
  • Video overlay similar to youtube
  • Double tap to seek video.
  • On video tap show/hide video overlay.
  • Auto hide overlay
  • Change playback speed
  • Custom overlay
  • Custom progress bar
  • Custom labels
  • Change video quality (for vimeo and youtube)
  • Enable/disable fullscreen player
  • [TODO] support for live youtube video
  • [TODO] support for video playlist

Features on web #

  • Double tap on Video player to enable/disable fullscreen

  • Mute/unmute volume

  • Video player integration with keyboard

    • SPACE play/pause video
    • M mute/unMute video
    • F enable/disable fullscreen
    • ESC enable/disable fullscreen
    • -> seek video forward
    • <- seek video backward
  • Double tap on video (enable/diables fullscreen)

Demo #


  • Playing videos from youtube

pod_player


  • Vimeo player and custom video player

Change quality and playback speedControl video from any where

  • Controls similar to youtube

with overlaywithout overlay (alwaysShowProgressBar = true)

  • On mobile full screen


  • Video controls

On Double tapCustom progress bar

  • Video player on web



pod_player

Usage #

Installation #


In your pubspec.yaml file within your Flutter Project:

dependencies:
  pod_player: <latest_version>

Android #


If you are using network-based videos, ensure that the following permission is present in your Android Manifest file, located in <project root>/android/app/src/main/AndroidManifest.xml:

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

If you need to access videos using http (rather than https) URLs.

Located inside application tag

<application
  - - -
  - - - - - -
  android:usesCleartextTraffic="true"

Ios #


Add permissions to your app's Info.plist file,

located in <project root>/ios/Runner/Info.plist

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

if u are using youtube or vimeo player on web, then there will be some issue with CORS only in web, so use this flutter_cors package

using flutter_cors package to enable or disable CORS

To Enable CORS (run this command )

dart pub global activate flutter_cors
fluttercors --enable

To Disable CORS (run this command )

fluttercors --disable

How to use #


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

class PlayVideoFromNetwork extends StatefulWidget {
  const PlayVideoFromNetwork({Key? key}) : super(key: key);

  @override
  State<PlayVideoFromNetwork> createState() => _PlayVideoFromNetworkState();
}

class _PlayVideoFromNetworkState extends State<PlayVideoFromNetwork> {
  late final PodPlayerController controller;

  @override
  void initState() {
    controller = PodPlayerController(
      playVideoFrom: PlayVideoFrom.network(
        'https://commondatastorage.flutter-io.cn/gtv-videos-bucket/sample/ForBiggerFun.mp4',
      ),
    )..initialise();
    super.initState();
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

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

Configure pod player #

  controller = PodPlayerController(
    playVideoFrom: PlayVideoFrom.youtube('https://youtu.be/A3ltMaM6noM'),
    podPlayerConfig: const PodPlayerConfig(
      autoPlay: true,
      isLooping: false,
      videoQualityPriority: [720, 360]
    )
  )..initialise();

Add Thumbnail #

PodVideoPlayer(
  controller: controller,
  videoThumbnail: const DecorationImage(
    /// load from asset: AssetImage('asset_path')
    image: NetworkImage('https://images.unsplash.com/photo-1569317002804-ab77bcf1bce4?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MXx8dW5zcGxhc2h8ZW58MHx8MHx8&w=1000&q=80',
    ),
    fit: BoxFit.cover,
  ),
),

Add PodPlayerLabels (custom labels) #

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: PodVideoPlayer(
      controller: controller,
      podPlayerLabels: const PodPlayerLabels(
        play: "Play label customized",
        pause: "Pause label customized",
        ...
      ),
    ),
  );
}

How to play video from youtube #


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

class PlayVideoFromYoutube extends StatefulWidget {
  const PlayVideoFromYoutube({Key? key}) : super(key: key);

  @override
  State<PlayVideoFromYoutube> createState() => _PlayVideoFromYoutubeState();
}

class _PlayVideoFromYoutubeState extends State<PlayVideoFromYoutube> {
  late final PodPlayerController controller;

  @override
  void initState() {
    controller = PodPlayerController(
      playVideoFrom: PlayVideoFrom.youtube('https://youtu.be/A3ltMaM6noM'),
    )..initialise();
    super.initState();
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

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

How to play video from vimeo #


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

class PlayVideoFromVimeo extends StatefulWidget {
  const PlayVideoFromVimeo({Key? key}) : super(key: key);

  @override
  State<PlayVideoFromVimeo> createState() => _PlayVideoFromVimeoState();
}

class _PlayVideoFromVimeoState extends State<PlayVideoFromVimeo> {
  late final PodPlayerController controller;

  @override
  void initState() {
    controller = PodPlayerController(
      playVideoFrom: PlayVideoFrom.vimeo('518228118'),
    )..initialise();
    super.initState();
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

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

Options #


  • Options for mobile

Normal player optionVimeo player optionChange quality of video

Example #


Please run the app in the example/ folder to start playing!

175
likes
140
pub points
96%
popularity

Publisher

unverified uploader

Vimeo and youtube player for flutter, Pod player provides customizable video player controls that support android, ios and web.

Repository (GitHub)

Documentation

API reference

License

Icon for licenses.MIT (LICENSE)

Dependencies

flutter, get, http, lottie, universal_html, video_player, wakelock, youtube_explode_dart

More

Packages that depend on pod_player