Flutter : InteractiveViewer inside Stack

Question

Problem :

• I am trying to scale widgets inside a Stack but that does not seem to work.

• The solution was to add constrained: false to the InteractiveViewer.

• But then, it throws error saying "widgets have infinite size", which is true thanks to constrained: false. Because it removes all constrains from InteractiveViewer

• I also tried wrapping Stack and each canvasElement with Container or SizedBox.shrink but both don't seem to work.

Goal :

• The goal is to be able to Pan and Scale widgets inside a Stack

Here is my code :

• Note : I have removed GestureDetector or else code would be too long to read

class _EditorState extends State<Editor> {
  List<Widget> _canvasElements = [];
  List<Offset> _canvasElementOffsets = [];

  @override
  void initState() {
    super.initState();
    _canvasElements.add(Text('Scale me'));
    _canvasElementOffsets.add(Offset(150, 250));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: List.generate(
          _canvasElements.length,
          (index) => Positioned(
            left: _canvasElementOffsets[index].dx,
            top: _canvasElementOffsets[index].dy,
            child: InteractiveViewer(
              minScale: 0.5,
              maxScale: 5,
              constrained: false,
              child: _canvasElements[index],
            ),
          ),
        ),
      ),
    );
  }
}

Widgets are moving but not scaling :