pskink / matrix_gesture_detector

A gesture detector mapping translation/rotation/scale gestures to a Matrix4 object.
Other
134 stars 101 forks source link

Resetting the matrix #8

Closed thearthurdev closed 4 years ago

thearthurdev commented 4 years ago

Is there a way to reset the matrix to Matrix4.identity()?

I'm currently trying to do this by setting the Matrix4 variable matrix, which is assigned to a Transform widget, to setState(() => matrix = Matrix4.identity()); on the press of a button.

This seems to work but once I try to move the transform widget is jumps and starts it's transformation from the pre-reset state.

pskink commented 4 years ago

see 3 other parameters of onMatrixUpdate and static compose() method

On Thu, Feb 13, 2020, 14:57 Delords Arthur notifications@github.com wrote:

Is there a way to reset the matrix to Matrix4.identity()?

I'm currently trying to do this by setting the Matrix4 variable matrix, which is assigned to a Transform widget, to setState(() => matrix = Matrix4.identity()); on the press of a button.

This seems to work but once I try to move the transform widget is jumps and starts it's transformation from the pre-reset state.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/pskink/matrix_gesture_detector/issues/8?email_source=notifications&email_token=ABNPVCBAKPMTDW5EXGSCKXLRCVGUBA5CNFSM4KUTCSD2YY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4INIUQ6A, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABNPVCHPNILAZDLKLRTF3L3RCVGUBANCNFSM4KUTCSDQ .

thearthurdev commented 4 years ago

I didn't really understand the reply but I worked around the problem by calling Navigator.pushReplacement() and passing in the same route. This solves my issue and then some.

You may explain how in more detail what you meant in the reply or go ahead and close the issue. Thanks for the quick reply!

pskink commented 4 years ago

you are using only the first passed matrix which equals to tm sm rm - if you want to set your matrix at any time you need to make that multiplication on your own - that's why there is "compose" method - if still not clear see it's implementation in the sources

On Fri, Feb 14, 2020, 21:07 Delords Arthur notifications@github.com wrote:

I didn't really understand the reply but I worked around the problem by calling Navigator.pushReplacement() and passing in the same route. This solves my issue and then some.

You may explain how in more detail what you meant in the reply or go ahead and close the issue. Thanks for the quick reply!

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/pskink/matrix_gesture_detector/issues/8?email_source=notifications&email_token=ABNPVCFISJZD7D63ALN7333RC32XLA5CNFSM4KUTCSD2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEL2JAYA#issuecomment-586453088, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABNPVCEYO3PCZCI5YFPQPSTRC32XLANCNFSM4KUTCSDQ .

scopendo commented 4 years ago

Hi @pskink – I didn't understand the reply either. I think what both @ArthurDevv and I are trying to do is reset the transformed child back to its initial rendered state.

With the code below, if I've zoomed the child, then the child reverts to looking correct after resetting the matrix, but the next gesture causes the child to render as it did prior to the reset.

  @override
  void initState() {
    super.initState();
    _initialMatrix = Matrix4.identity()..scale(0.9);
    _matrix = _initialMatrix;
  }

  @override
  Widget build(BuildContext context) {
    return MatrixGestureDetector(
      shouldRotate: false,
      onMatrixUpdate: (Matrix4 m, Matrix4 tm, Matrix4 sm, Matrix4 rm) {
        setState(() => _matrix = m);
      },
      child: Stack(
        children: <Widget>[
          LayoutBuilder(
            builder: (context, constraints) => Container(
              height: constraints.maxHeight,
              width: constraints.maxWidth,
              child: Center(
                child: Transform(
                  alignment: FractionalOffset.center,
                  transform: _matrix,
                  child: Stack(
                    children: <Widget>[
                      Image.asset("images/example.png"),
                      ..._otherWidgets(context),
                    ],
                  ),
                ),
              ),
            ),
          ),
          if (_matrix != _initialMatrix)
            Positioned(
              top: 30,
              right: 30,
              child: FloatingActionButton(
                child: Icon(Icons.undo),
                onPressed: () => setState(() => _matrix = _initialMatrix),
              ),
            ),
        ],
      ),
    );
  }
pskink commented 4 years ago

here is some demo on how to use "compose" method - now you can do whatever you want with "matrix", https://github.com/pskink/matrix_gesture_detector/blob/master/example/lib/transform_demo2.dart

On Sat, Feb 15, 2020, 15:59 Scott Barden notifications@github.com wrote:

Hi @pskink https://github.com/pskink – I didn't understand the reply either. I think what both @ArthurDevv https://github.com/ArthurDevv and I are trying to do is reset the transformed child back to it's initial rendered state.

With the code below, if I've zoomed the child, then the child reverts to looking correct after resetting the matrix, but the next gesture causes the child to render as it did prior to the reset.

@override

void initState() {

super.initState();

_initialMatrix = Matrix4.identity()..scale(0.9);

_matrix = _initialMatrix;

}

@override

Widget build(BuildContext context) {

return MatrixGestureDetector(

  shouldRotate: false,

  onMatrixUpdate: (Matrix4 m, Matrix4 tm, Matrix4 sm, Matrix4 rm) {

    setState(() => _matrix = m);

  },

  child: Stack(

    children: <Widget>[

      LayoutBuilder(

        builder: (context, constraints) => Container(

          height: constraints.maxHeight,

          width: constraints.maxWidth,

          child: Center(

            child: Transform(

              alignment: FractionalOffset.center,

              transform: _matrix,

              child: Stack(

                children: <Widget>[

                  Image.asset("images/example.png"),

                  ..._otherWidgets(context),

                ],

              ),

            ),

          ),

        ),

      ),

      if (_matrix != _initialMatrix)

        Positioned(

          top: 30,

          right: 30,

          child: FloatingActionButton(

            child: Icon(Icons.undo),

            onPressed: () => setState(() => _matrix = _initialMatrix),

          ),

        ),

    ],

  ),

);

}

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/pskink/matrix_gesture_detector/issues/8?email_source=notifications&email_token=ABNPVCBV7N2V4H36Y3BBRXTRC77MBA5CNFSM4KUTCSD2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEL3MOSA#issuecomment-586598216, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABNPVCBFLJWRNXALSVT5I4TRC77MBANCNFSM4KUTCSDQ .

scopendo commented 4 years ago

Thank you @pskink. The code above now works fine after changing onMatrixUpdate to:

  onMatrixUpdate: (Matrix4 m, Matrix4 tm, Matrix4 sm, Matrix4 rm) {
    setState(() => _matrix = MatrixGestureDetector.compose(_matrix, tm, sm, rm));
  }
thearthurdev commented 4 years ago

I can confirm that @scopendo's code solves my issue as well. Thanks for the assistance @pskink. I'm going to close the issue now.