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

Features

• Play youtube videos (using video URL or ID)
• Play vimeo videos (using video ID)
• Play vimeo private videos (using video ID, access token)
• 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
• 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

---



---



---

---



---

---

---




Usage

• Installation
  • Android
  • Ios
  • Web
• How to use
• Configure pod player
• Add Thumbnail
• How to play video from youtube
• How to play video from vimeo
• How to play video from vimeo private videos
• video player Options
• Example

Installation

---

Android

---

Ios

---

Web ( Not recommended in production)

---

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> { final PodPlayerController controller; @override void initState() { controller = PodPlayerController( playVideoFrom: PlayVideoFrom.network( 'https://commondatastorage.googleapis.com/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> { 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> { 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), ); } }

How to play video from vimeo private videos

---

import 'package:pod_player/pod_player.dart'; import 'package:flutter/material.dart'; class PlayVideoFromVimeoPrivateVideo extends StatefulWidget { const PlayVideoFromVimeoPrivateVideo({Key key}) : super(key: key); @override State<PlayVideoFromVimeoPrivateVideo> createState() => _PlayVideoFromVimeoPrivateVideoState(); } class _PlayVideoFromVimeoPrivateVideoState extends State<PlayVideoFromVimeoPrivateVideo> { final PodPlayerController controller; @override void initState() { String videoId = 'your private video id'; String token = 'your access token'; final Map<String, String> headers = <String, String>{}; headers['Authorization'] = 'Bearer ${token}'; controller = PodPlayerController( playVideoFrom: PlayVideoFrom.vimeoPrivateVideos( videoId, httpHeaders: headers ), )..initialise(); super.initState(); } @override void dispose() { controller.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return Scaffold( body: PodVideoPlayer(controller: controller), ); } }

Options

---




Example

---

folder to start playing!

GitHub

View Github