Flutter Zoomable Widget

后端 未结 5 664
后悔当初
后悔当初 2020-11-30 09:28

What I want to build is a widget that can make its child widget zoomable similar to the zoomable behavior.

Gestures I want to cover are

  1. Pinch To Zoom
5条回答
  •  时光取名叫无心
    2020-11-30 09:49

    I loved de resolution, you should put that in a packged in pub, you can even put some custom options, in my code I put doubletap to reset the zoom and locked the rotation.

    import 'package:flutter/material.dart';
    import 'package:matrix_gesture_detector/matrix_gesture_detector.dart';
    
    class ZoomableWidget extends StatefulWidget {
      final Widget child;
    
      const ZoomableWidget({Key key, this.child}) : super(key: key);
      @override
      _ZoomableWidgetState createState() => _ZoomableWidgetState();
    }
    
    class _ZoomableWidgetState extends State {
      Matrix4 matrix = Matrix4.identity();
      Matrix4 zerada =  Matrix4.identity();
    
      @override
      Widget build(BuildContext context) {
        return GestureDetector(
          onDoubleTap: (){
            setState(() {
              matrix = zerada;
            });
          },
          child: MatrixGestureDetector(
            shouldRotate: false,
            onMatrixUpdate: (Matrix4 m, Matrix4 tm, Matrix4 sm, Matrix4 rm) {
              setState(() {
                matrix = m;
              });
            },
            child: Transform(
              transform: matrix,
              child: widget.child,
            ),
          ),
        );
      }
    }
    

提交回复
热议问题