Menu
Products
Products
Video Hosting
Upload and manage your videos in a centralized video library.
Image Hosting
Upload and manage all your images in a centralized library.
Galleries
Choose from 100+templates to showcase your media in style.
Video Messaging
Record, and send personalized video messages.
CincoTube
Create your own community video hub your team, students or fans.
Pages
Create dedicated webpages to share your videos and images.
Live
Create dedicated webpages to share your videos and images.
For Developers
Video API
Build a unique video experience.
DeepUploader
Collect and store user content from anywhere with our file uploader.
Solutions
Solutions
Enterprise
Supercharge your business with secure, internal communication.
Townhall
Webinars
Team Collaboration
Learning & Development
Creative Professionals
Get creative with a built in-suite of editing and marketing tools.
eCommerce
Boost sales with interactive video and easy-embedding.
Townhall
Webinars
Team Collaboration
Learning & Development
eLearning & Training
Host and share course materials in a centralized portal.
Sales & Marketing
Attract, engage and convert with interactive tools and analytics.
"Cincopa helped my Enterprise organization collaborate better through video."
Book a Demo
Resources
Resources
Blog
Learn about the latest industry trends, tips & tricks.
Help Centre
Get access to help articles FAQs, and all things Cincopa.
Partners
Check out our valued list of partners.
Product Updates
Stay up-to-date with our latest greatest features.
Ebooks, Guides & More
Customer Stories
Hear how we've helped businesses succeed.
Boost Campaign Performance Through Video
Discover how to boost your next campaign by using video.
Download Now
Pricing
Log in
Get a demo
Get Started
Playing videos inside mobile apps has become an essential feature for modern user interfaces, whether it’s tutorials, product demos, or entertainment content. In Flutter, building a smooth and responsive video playback experience requires the use of the VideoPlayer widget. As a result, it helps developers to handle video streaming, play and pause controls, and buffering with minimal effort. Understanding how you can implement it properly will ensure better media handling, user engagement, and overall app performance. Required Tools To build this app, you need the following items installed on your machine: Visual Studio Code / Android Studio Android Emulator / iOS Simulator / Physical Device. Flutter Installed Flutter plugin for VS Code / Android Studio. Step-by-Step Implementations Let’s now shift the focus from understanding the VideoPlayer widget to actually wiring it into a working Flutter app. Each step gradually connects the tools, packages, and code needed so the video can load, display, and respond smoothly to user actions. Step 1: Create a new Flutter Application Create a new Flutter application using the command prompt. To create a new app, write the following command and run it. flutter create app_name Step 2: Add the Required Dependency Add the below dependency to your pubspec.yaml file. dependencies: dependencies: flutter: sdk: flutter video_player: ^2.10.0 Step 3: Import the Package First of all, import material.dart file. import 'package:video_player/video_player.dart'; import 'package:flutter/material.dart'; Step 4: Execute the main Method Call the runApp() method in the main() method to start the app. void main() { runApp(MyApp()); } Step 5: Create MyApp Class In this class, we are going to implement the MaterialApp , Here, we are also setting the Theme of our App. class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData( primarySwatch: Colors.green, // Set the app's primary theme color ), debugShowCheckedModeBanner: false, home: Scaffold( appBar: AppBar( title: Text('Video Player'), ), body: Center( child: VideoPlayerApp(), ), ), ); } } Step 6: Create VideoPlayerApp Class In this class, we are going to implement the VideoPlayer that helps to play a video in a Flutter app. class VideoPlayerApp extends StatefulWidget { @override _VideoPlayerAppState createState() => _VideoPlayerAppState(); } class _VideoPlayerAppState extends State
{ VideoPlayerController? _controller; @override void initState() { super.initState(); // Create a VideoPlayerController for the video you want to play. // ignore: deprecated_member_use _controller = VideoPlayerController.network( 'https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4', ); // Initialize the VideoPlayerController. _controller!.initialize(); // Play the video. _controller!.play(); } @override Widget build(BuildContext context) { return AspectRatio( aspectRatio: _controller!.value.aspectRatio, child: VideoPlayer(_controller!), ); } @override void dispose() { super.dispose(); // Dispose of the VideoPlayerController. _controller!.dispose(); } } Complete Source Code main.dart: import 'package:flutter/material.dart'; import 'package:video_player/video_player.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( theme: ThemeData( primarySwatch: Colors.green, // Set the app's primary theme color ), debugShowCheckedModeBanner: false, home: Scaffold( appBar: AppBar(title: Text('Video Player')), body: Center(child: VideoPlayerApp()), ), ); } } class VideoPlayerApp extends StatefulWidget { @override _VideoPlayerAppState createState() => _VideoPlayerAppState(); } class _VideoPlayerAppState extends State
{ VideoPlayerController? _controller; @override void initState() { super.initState(); // Create a VideoPlayerController for the video you want to play. // ignore: deprecated_member_use _controller = VideoPlayerController.network( 'https://flutter.github.io/assets-for-api-docs/assets/videos/bee.mp4', ); // Initialize the VideoPlayerController. _controller!.initialize(); // Play the video. _controller!.play(); } @override Widget build(BuildContext context) { return AspectRatio( aspectRatio: _controller!.value.aspectRatio, child: VideoPlayer(_controller!), ); } @override void dispose() { super.dispose(); // Dispose of the VideoPlayerController. _controller!.dispose(); } } Output: