flutter_vimeo 1.0.4

Flutter package to play Vimeo videos using the InAppWebView plugin.

Flutter Vimeo

A Flutter package for playing Vimeo videos using the InAppWebView plugin. This package provides a customizable Vimeo player widget with various controls and event callbacks.

Features

• Play Vimeo videos using InAppWebView
• Customizable player settings:
  • Auto-play
  • Looping
  • Muted
  • Show/hide title
  • Show/hide byline
  • Show/hide controls
  • Enable/disable DNT (Do Not Track)
• Event callbacks for:
  • Video ready
  • Play
  • Pause
  • Finish
  • Seek
  • Time update
• Fullscreen support
• Background color customization
• Start time configuration

Preview

https://github.com/user-attachments/assets/f7c76ea4-b16a-4816-86ba-390f7de8566b

Installation

Add the following to your pubspec.yaml file:

dependencies:
  flutter_vimeo: ^latest-version

Then run:

flutter pub get

Usage

Basic Usage

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

class MyVideoPlayer extends StatelessWidget {
  const MyVideoPlayer({super.key});

  @override
  Widget build(BuildContext context) {
    return FlutterVimeoPlayer(
      videoId: '123456789', // Replace with your Vimeo video ID
    );
  }
}

Advanced Usage with Controller

class AdvancedVimeoPlayerScreen extends StatefulWidget {
  const AdvancedVimeoPlayerScreen({super.key});

  @override
  State<AdvancedVimeoPlayerScreen> createState() => _AdvancedVimeoPlayerScreenState();
}

class _AdvancedVimeoPlayerScreenState extends State<AdvancedVimeoPlayerScreen> {
   FlutterVimeoController? controller ;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Advanced Vimeo Player')),
      body: Column(
        children: [
          FlutterVimeoPlayer(
            videoId: '123456789',
            controller: controller,
            isAutoPlay: true,
            showTitle: true,
            backgroundColor: Colors.black,
            onInAppWebViewCreated: (controller){
              controller = FlutterVimeoController(
                              inAppWebViewController: controller);
            },
            onReady: (totalDuration, currentDuration) {
              debugPrint('Video ready: Total duration: $totalDuration');
            },
            onPlay: (totalDuration, currentDuration) {
              debugPrint('Video playing: Current duration: $currentDuration');
            },
          ),
          const SizedBox(height: 20),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: [
              ElevatedButton(
                onPressed: () => controller.play(),
                child: const Text('Play'),
              ),
              ElevatedButton(
                onPressed: () => controller.pause(),
                child: const Text('Pause'),
              ),
              ElevatedButton(
                onPressed: () => controller.seekTo(30.0),
                child: const Text('Seek to 30s'),
              ),
            ],
          ),
        ],
      ),
    );
  }
}

FlutterVimeoController

The FlutterVimeoController provides methods to control the Vimeo player programmatically:

// Create a controller
FlutterVimeoController? controller;

onInAppWebViewCreated: (controller){
              controller = FlutterVimeoController(
                              inAppWebViewController: controller);
            },

// Play the video
controller?.nextVideoWithJS('987654321');

Getting a Vimeo Video ID

To get a Vimeo video ID:

1. Go to the Vimeo video you want to play
2. Copy the ID from the URL
   • Example: For https://vimeo.com/123456789, the ID is 123456789

Parameters

Parameter	Type	Default	Description
videoId	String	required	The Vimeo video ID
isAutoPlay	bool	false	Whether to auto-play the video
isLooping	bool	false	Whether to loop the video
isMuted	bool	false	Whether to mute the video
showTitle	bool	false	Whether to show the video title
showByline	bool	false	Whether to show the video byline
showControls	bool	true	Whether to show video controls
enableDNT	bool	true	Whether to enable Do Not Track
startTime	double	0.0	Start time in seconds
backgroundColor	Color	Colors.black	Background color of the player
onReady	DurationCallBack?	null	Called when the video is ready
onPlay	DurationCallBack?	null	Called when the video starts playing
onPause	DurationCallBack?	null	Called when the video is paused
onFinish	DurationCallBack?	null	Called when the video finishes
onSeek	DurationCallBack?	null	Called when seeking in the video
onTimeUpdate	DurationCallBack?	null	Called when the video time updates
controller	FlutterVimeoController?	null	Controller to manage the player programmatically

Example

See the example directory for a complete example application.

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

This project is licensed under the MIT License - see the LICENSE file for details.