title: Flutter draw onto image and scale & move both
body: <p>preface: I'm building an application for a building that can navigate a user, one of the ways I am doing this is by using a floor plan of the building and I want to draw a path between nodes in this floor plan to create a route (not with realtime updates). The user enters where they want to be and after my route finding algorithm has outputted a path I want to use that for my line placement.</p>
  
  <p>I have used a library called <a href="https://github.com/renancaraujo/photo_view" rel="nofollow noreferrer">Photo View</a> to allow me to zoom in and move the image of the floor plan around the screen but I need to draw my route on, and then have it follow the floor plan as if it was part of the image. Realistically I think for the drawing I'd want the canvas size to be relative to the image not the screen (so 0,0 is the top-left corner of the image) but I'm unsure on how to access this.</p>
  
  <p>Am I going down the wrong path using Photo View and should I be using something native to dart/flutter instead?</p>
  
  <p>I also want to add a FAB that I can press to draw my route over the original image but I don't know how to go around this with the child issue</p>
  
  <p>Here's some of what I have so far: </p>
  
  <pre><code>Widget build(BuildContext context) {
    return Container(
      child: new CustomPaint(
      foregroundPainter: RoutePainter(),
      child: PhotoView(
        imageProvider: AssetImage('assets/images/floor1_temp.png'),
        minScale: PhotoViewComputedScale.contained,
      maxScale: 1.5,
      ),
    ));
  }
  </code></pre>