Flutter - Position of Draggable Elements

122 Views Asked by At

I'm working on a Story feature that is similar to Instagram. One part will be draggable widgets (think text, gifs, or images).

I am allowing the user to rotate & scale these widgets.

I'm trying to get the widgets to display the same, or as closely as possible, on various screen sizes.

I have tried using both position.dy & position.dy values as well as using the left & top coordinates.

When viewing my widget I have tried something like this:

return Positioned(
      left: left,
      top: top,
      child: Transform.rotate(
        angle: rotation,
        child: Transform.scale(
          scale: scale,
            child: Container(
              width: width,
              height: height,
              child: // Custom Widget
            ),
          ),
        ),
    );

Where left, top, rotation, scale, width, and height are all saved when I create my widget & drag it to the desired location + any rotation or scale.

This seems to work ok, but there are many times that the item may be partially off-screen or just not close enough to match up -- main use case(s) is if the story was created on an iPhone 14 Pro & viewed on an iPhone SE or vice versa.

Any suggestions are appreciated!

0

There are 0 best solutions below