Merge pull request #14 from dshukertjr/feature/video_play

Drastically improved video play performance

Author: dshukertjr

lib/components/full_screen_video_player.dart

@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:video_player/video_player.dart';
 
-class FullScreenVideoPlayer extends StatelessWidget {
+class FullScreenVideoPlayer extends StatefulWidget {
   const FullScreenVideoPlayer({
     Key? key,
     required VideoPlayerController videoPlayerController,
@@ -10,32 +10,78 @@ class FullScreenVideoPlayer extends StatelessWidget {
 
   final VideoPlayerController _videoPlayerController;
 
+  @override
+  _FullScreenVideoPlayerState createState() => _FullScreenVideoPlayerState();
+}
+
+class _FullScreenVideoPlayerState extends State<FullScreenVideoPlayer> {
   @override
   Widget build(BuildContext context) {
     return GestureDetector(
-      onTap: () {
+      onTap: () async {
         // Toggle video play
-        if (_videoPlayerController.value.isPlaying) {
-          _videoPlayerController.pause();
+        if (widget._videoPlayerController.value.isPlaying) {
+          await widget._videoPlayerController.pause();
         } else {
-          _videoPlayerController.play();
+          if (isVideoAtEnd) {
+            await widget._videoPlayerController.seekTo(Duration.zero);
+          }
+          await widget._videoPlayerController.play();
         }
       },
-      child: ClipRect(
-        child: OverflowBox(
-          alignment: Alignment.center,
-          child: FittedBox(
-            fit: BoxFit.cover,
-            child: SizedBox(
-              height: 1,
-              child: AspectRatio(
-                aspectRatio: _videoPlayerController.value.aspectRatio,
-                child: VideoPlayer(_videoPlayerController),
+      child: Stack(
+        fit: StackFit.expand,
+        children: [
+          ClipRect(
+            child: OverflowBox(
+              alignment: Alignment.center,
+              child: FittedBox(
+                fit: BoxFit.cover,
+                child: SizedBox(
+                  height: 1,
+                  child: AspectRatio(
+                    aspectRatio: widget._videoPlayerController.value.aspectRatio,
+                    child: VideoPlayer(widget._videoPlayerController),
+                  ),
+                ),
               ),
             ),
           ),
-        ),
+          if (!widget._videoPlayerController.value.isPlaying)
+            Center(
+              child: Material(
+                borderRadius: BorderRadius.circular(100),
+                color: const Color(0xFF000000).withOpacity(0.25),
+                child: const Padding(
+                  padding: EdgeInsets.all(16.0),
+                  child: Icon(
+                    Icons.play_arrow,
+                    size: 56,
+                  ),
+                ),
+              ),
+            ),
+        ],
       ),
     );
   }
+
+  @override
+  void initState() {
+    widget._videoPlayerController.addListener(updateUi);
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    widget._videoPlayerController.removeListener(updateUi);
+    super.dispose();
+  }
+
+  void updateUi() {
+    setState(() {});
+  }
+
+  bool get isVideoAtEnd =>
+      widget._videoPlayerController.value.duration == widget._videoPlayerController.value.position;
 }

lib/cubits/video/video_cubit.dart

@@ -161,7 +161,6 @@ class VideoCubit extends Cubit<VideoState> {
       if (_videoPlayerController == null) {
         _videoPlayerController = await _repository.getVideoPlayerController(_videoDetail!.url);
         await _videoPlayerController!.initialize();
-        await _videoPlayerController!.setLooping(true);
         await _videoPlayerController!.play();
 
         emit(VideoPlaying(

lib/repositories/repository.dart

@@ -439,8 +439,7 @@ class Repository {
   }
 
   Future<VideoPlayerController> getVideoPlayerController(String url) async {
-    final file = await DefaultCacheManager().getSingleFile(url);
-    return VideoPlayerController.file(file);
+    return VideoPlayerController.network(url);
   }
 
   Future<bool> hasLocationPermission() async {

pubspec.yaml

@@ -1,6 +1,6 @@
 name: spot
 description: Find local video posts
-version: 1.0.11+21
+version: 1.0.12+22
 publish_to: none
 
 environment: