PageView + video_player package

video.dart

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

class Desafio extends StatefulWidget {
  const Desafio({Key? key}) : super(key: key);

  @override
  State<Desafio> createState() => DD();
}

class DD extends State<Desafio> {
  final imageController = TransformationController();
  final pageCont = PageController();
  late VideoPlayerController videoCont;
  TapDownDetails? tapDownDetails;
  //late AnimationController anim;

  @override
  void initState() {
    super.initState();
    videoCont = VideoPlayerController.asset('images/teste.mp4')
      ..addListener(() => setState(() { 
      }))
      ..setLooping(true)
      ..initialize().then((_) => videoCont.play());
  }

  @override
  void dispose() {
    imageController.dispose();
    videoCont.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    return Scaffold(
      body: SafeArea(
        child: Container(
          alignment: Alignment.center,
          padding: const EdgeInsets.all(20),
          child: Column(
            children: [
              Container(
                height: size.height * 0.5,
                padding: const EdgeInsets.all(8),
                decoration: BoxDecoration(
                  color: Colors.red,
                  borderRadius: BorderRadius.circular(20)
                ),
                child: PageView(
                  onPageChanged: (int? page) {
                    if(page != 0)
                      videoCont.pause();
                    else
                      videoCont.play();
                  },
                  controller: pageCont,
                  children: [
                    ClipRRect(
                      borderRadius: BorderRadius.circular(20),
                      child: VideoPlayer(videoCont),
                    ),
                    GestureDetector(
                      onDoubleTapDown: (details) => tapDownDetails = details,
                      onDoubleTap: () {
                        final position = tapDownDetails!.localPosition;

                        final x = -position.dx * (3 - 1);
                        final y = -position.dy * (3 - 1);
                        final zoomed = Matrix4.identity()
                          ..translate(x, y)
                          ..scale(3.0);
                        
                        final value = imageController.value.isIdentity() ? zoomed : Matrix4.identity(); 
                        imageController.value = value;
                      },
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(20),
                        child: InteractiveViewer(
                          transformationController: imageController,
                          scaleEnabled: false,
                          panEnabled: false,
                          child: Image.asset(
                            'images/example.png',
                            width: size.width * 0.7,
                            fit: BoxFit.cover
                          )
                        )
                      )
                    ),
                    GestureDetector(
                      onDoubleTapDown: (details) => tapDownDetails = details,
                      onDoubleTap: () {
                        final position = tapDownDetails!.localPosition;

                        final x = -position.dx * (3 - 1);
                        final y = -position.dy * (3 - 1);
                        final zoomed = Matrix4.identity()
                          ..translate(x, y)
                          ..scale(3.0);
                        
                        final value = imageController.value.isIdentity() ? zoomed : Matrix4.identity(); 
                        imageController.value = value;
                      },
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(20),
                        child: InteractiveViewer(
                          transformationController: imageController,
                          scaleEnabled: false,
                          panEnabled: false,
                          child: Image.asset(
                            'images/example2.png',
                            width: size.width * 0.7,
                            fit: BoxFit.cover
                          )
                        )
                      )
                    ),
                  ]
                )
              )
            ]
          )
        )
      )
    );
  }
}