Skip to content

Commit 1688e61

Browse files
committed
feat: Add video zoom functionality in lightbox
Implements pinch-to-zoom and pan gestures for videos in the lightbox view. This allows users to zoom in/out (up to 5x) and pan around while maintaining proper aspect ratio. Fixes zulip#1287
1 parent ae7939a commit 1688e61

File tree

1 file changed

+16
-13
lines changed

1 file changed

+16
-13
lines changed

lib/widgets/lightbox.dart

+16-13
Original file line numberDiff line numberDiff line change
@@ -444,6 +444,7 @@ class VideoLightboxPage extends StatefulWidget {
444444

445445
class _VideoLightboxPageState extends State<VideoLightboxPage> with PerAccountStoreAwareStateMixin<VideoLightboxPage> {
446446
VideoPlayerController? _controller;
447+
final TransformationController _transformationController = TransformationController();
447448

448449
@override
449450
void onNewStore() {
@@ -494,6 +495,7 @@ class _VideoLightboxPageState extends State<VideoLightboxPage> with PerAccountSt
494495
_controller?.removeListener(_handleVideoControllerUpdate);
495496
_controller?.dispose();
496497
_controller = null;
498+
_transformationController.dispose();
497499
// The VideoController doesn't emit a pause event
498500
// while disposing, so disable the wakelock here
499501
// explicitly.
@@ -546,21 +548,22 @@ class _VideoLightboxPageState extends State<VideoLightboxPage> with PerAccountSt
546548
return _LightboxPageLayout(
547549
routeEntranceAnimation: widget.routeEntranceAnimation,
548550
message: widget.message,
549-
buildAppBarBottom: (context) => null,
551+
buildAppBarBottom: null,
550552
buildBottomAppBar: _buildBottomAppBar,
551-
child: SafeArea(
552-
child: Center(
553-
child: Stack(alignment: Alignment.center, children: [
554-
if (_controller != null && _controller!.value.isInitialized)
555-
AspectRatio(
553+
child: _controller == null
554+
? const Center(child: CircularProgressIndicator())
555+
: Center(
556+
child: InteractiveViewer(
557+
transformationController: _transformationController,
558+
minScale: 1.0,
559+
maxScale: 5.0,
560+
child: AspectRatio(
556561
aspectRatio: _controller!.value.aspectRatio,
557-
child: VideoPlayer(_controller!)),
558-
if (_controller == null || !_controller!.value.isInitialized || _controller!.value.isBuffering)
559-
const SizedBox(
560-
width: 32,
561-
height: 32,
562-
child: CircularProgressIndicator(color: Colors.white)),
563-
]))));
562+
child: VideoPlayer(_controller!),
563+
),
564+
),
565+
),
566+
);
564567
}
565568
}
566569

0 commit comments

Comments
 (0)