I need to apply the Matrix4 transformation to my image wrapped inside a InteractiveViewer.

It works OK on the original device that modify the Matrix4 (pan/zoom), problem is when I send the Matrix4 values to another device (Tablet for example) to load the same image and reuse the Matrix4 transformation, it is not the same, so I suspected it might be because of the screen sizes.

The Matrix4 is sent as String message using String.fromCharCodes(matrix4.storage.buffer.asUint8List())

I tried sending the scale value and translate offset separately to use Transform.scale() and Transform.translate() but it does not work very well.

My layout is as below:

Stack(
        alignment: Alignment.bottomCenter,
        children: [
          Center(
            child: LayoutBuilder(
              builder: (context, constraints) {
                return ClipRect(
                  child: SizedBox(
                    width: constraints.maxWidth,
                    height: constraints.maxHeight,
                    child: InteractiveViewer(
                      transformationController: _controller,
                      child: Image.network('https://picsum.photos/seed/picsum/200/300'),
                    ),
                  ),
                );
              },
            ),
          ),
        ],
      );

My question is: How can I reuse the same Matrix4 transformation to produce the same result regardless of different devices and screen sizes?