Home > Mobile >  how to play video from video path in flutter
how to play video from video path in flutter

Time:01-04

I get a list of video files now I want to play the video using path, for example, video path is 'storage/emulated/0/vedio1.mp4'. how can I play it? now.

CodePudding user response:

with video_player package with that controller VideoPlayerController.file(... https://pub.dev/documentation/video_player/latest/video_player/VideoPlayerController/VideoPlayerController.file.html

CodePudding user response:

Use flutter's video_player

Example:

class _ButterFlyAssetVideo extends StatefulWidget {
  @override
  _ButterFlyAssetVideoState createState() => _ButterFlyAssetVideoState();
}

class _ButterFlyAssetVideoState extends State<_ButterFlyAssetVideo> {
  late VideoPlayerController _controller;

  @override
  void initState() {
    super.initState();
    _controller = VideoPlayerController.asset('assets/Butterfly-209.mp4');

    _controller.addListener(() {
      setState(() {});
    });
    _controller.setLooping(true);
    _controller.initialize().then((_) => setState(() {}));
    _controller.play();
  }

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

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: <Widget>[
          Container(
            padding: const EdgeInsets.only(top: 20.0),
          ),
          const Text('With assets mp4'),
          Container(
            padding: const EdgeInsets.all(20),
            child: AspectRatio(
              aspectRatio: _controller.value.aspectRatio,
              child: Stack(
                alignment: Alignment.bottomCenter,
                children: <Widget>[
                  VideoPlayer(_controller),
                  _ControlsOverlay(controller: _controller),
                  VideoProgressIndicator(_controller, allowScrubbing: true),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Refer Flutter CookBook

CodePudding user response:

// Inject video_player & chewie dependencies in your pubspec.yaml

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:chewie/chewie.dart';
import 'package:video_player/video_player.dart';

class ChewiePlayer extends StatefulWidget {
  static const routeName = '/VideoScreen';
  final File? videoUrl;
  final String? dimension; //1920*1080

  const ChewiePlayer({this.videoUrl, this.dimension,});

  @override
  State<ChewiePlayer> createState() => _ChewiePlayerState();
}

class _ChewiePlayerState extends State<ChewiePlayer> {
  VideoPlayerController? _controller;
  ChewieController? chewieController;

  @override
  void initState() {
    initialize();
    super.initState();
  }

  @override
  void dispose() {
    print('VideoScreen dispose');
    chewieController?.videoPlayerController.dispose();
    chewieController?.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.black,
      body: SafeArea(
        child: Center(
          child: AspectRatio(
            aspectRatio: _controller!.value.aspectRatio,
            child: Chewie(controller: chewieController!),
          ),
        ),
      ),
    );
  }

  Future<void> initialize() async {
    _controller = VideoPlayerController.file(widget.videoUrl!);
    /// you can also play network and asset video, than declare accordingly example: VideoPlayerController.network( paste your link )
    await _controller!.initialize().then((value) => setState(() {}));
    chewieController = ChewieController(
      videoPlayerController: _controller!,
      autoInitialize: false,
      autoPlay: false,
      allowPlaybackSpeedChanging: true,
      materialProgressColors:
          ChewieProgressColors(playedColor: Colors.blue, handleColor: Colors.blue, bufferedColor: Colors.grey),
      looping: false,
      errorBuilder: (context, errorMessage) {
        return Center(
          child: Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text(errorMessage, style: const TextStyle(color: Colors.white)),
          ),
        );
      },
    );
  }
}

// And use like this...

SizedBox(
  child: ChewiePlayer(videoUrl: File(filePath), dimension: '1920*1080'),
),
  • Related