Created
January 15, 2023 17:03
-
-
Save Sherlock-Holo/66cdb698c3e3df3e0c6098a5f0b7bf46 to your computer and use it in GitHub Desktop.
video play
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'dart:async'; | |
import 'package:flutter/material.dart'; | |
import 'package:video_player/video_player.dart'; | |
void main() => runApp(const VideoPlayerApp()); | |
class VideoPlayerApp extends StatelessWidget { | |
const VideoPlayerApp({super.key}); | |
@override | |
Widget build(BuildContext context) { | |
return const MaterialApp( | |
title: 'Video Player Demo', | |
home: VideoPlayerScreen(), | |
); | |
} | |
} | |
class VideoPlayerScreen extends StatefulWidget { | |
const VideoPlayerScreen({super.key}); | |
@override | |
State<VideoPlayerScreen> createState() => _VideoPlayerScreenState(); | |
} | |
class _VideoPlayerScreenState extends State<VideoPlayerScreen> { | |
late VideoPlayerController _controller; | |
late Future<void> _initializeVideoPlayerFuture; | |
@override | |
void initState() { | |
super.initState(); | |
// Create and store the VideoPlayerController. The VideoPlayerController | |
// offers several different constructors to play videos from assets, files, | |
// or the internet. | |
_controller = VideoPlayerController.network( | |
'https://flutter.github.io/assets-for-api-docs/assets/videos/butterfly.mp4', | |
); | |
// Initialize the controller and store the Future for later use. | |
_initializeVideoPlayerFuture = _controller.initialize(); | |
// Use the controller to loop the video. | |
_controller.setLooping(true); | |
} | |
@override | |
void dispose() { | |
// Ensure disposing of the VideoPlayerController to free up resources. | |
_controller.dispose(); | |
super.dispose(); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar( | |
title: const Text('Butterfly Video'), | |
), | |
// Use a FutureBuilder to display a loading spinner while waiting for the | |
// VideoPlayerController to finish initializing. | |
body: FutureBuilder( | |
future: _initializeVideoPlayerFuture, | |
builder: (context, snapshot) { | |
if (snapshot.hasData) { | |
// If the VideoPlayerController has finished initialization, use | |
// the data it provides to limit the aspect ratio of the video. | |
return AspectRatio( | |
aspectRatio: _controller.value.aspectRatio, | |
// Use the VideoPlayer widget to display the video. | |
child: VideoPlayer(_controller), | |
); | |
} else if (snapshot.hasError) { | |
return Text(snapshot.error.toString()); | |
} else { | |
// If the VideoPlayerController is still initializing, show a | |
// loading spinner. | |
return const Center( | |
child: CircularProgressIndicator(), | |
); | |
} | |
}, | |
), | |
floatingActionButton: FloatingActionButton( | |
onPressed: () { | |
// Wrap the play or pause in a call to `setState`. This ensures the | |
// correct icon is shown. | |
setState(() { | |
// If the video is playing, pause it. | |
if (_controller.value.isPlaying) { | |
_controller.pause(); | |
} else { | |
// If the video is paused, play it. | |
_controller.play(); | |
} | |
}); | |
}, | |
// Display the correct icon depending on the state of the player. | |
child: Icon( | |
_controller.value.isPlaying ? Icons.pause : Icons.play_arrow, | |
), | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment