Flutter - How to scale and draw over image in custompainter? - flutter

Question

I am trying to draw over image on custompainter. I am using the example on flutter custompainter video and here is what I have so far. I can draw in the image but I cannot scale image. How do I scale image on gesture and draw in image? I would prefer not to use any package.
Container(
height: double.infinity,
width: double.infinity,
color: Colors.black87,
child: FittedBox(
child: GestureDetector(
onScaleStart: _scaleStartGesture,
onScaleUpdate: _scaleUpdateGesture,
onScaleEnd: (_) => _scaleEndGesture(),
child: SizedBox(
height: _image.height.toDouble(),
width: _image.width.toDouble(),
child: CustomPaint(
willChange: true,
painter: ImagePainter(
image: _image,
points: points
),
),
),
),
),
),

Answer 1

Merge LongPressDraggable or Draggable and GestureDetector's onScaleUpdate;
onScaleUpdate: (s) {
if (!(s.scale == 1 && s.rotation == 0)) {
controller
..setImageRotate(s.rotation)
..setImageScale(s.scale)
..setImageOffset(s.focalPoint);
setState(() {
message = controller.selectedController.toString();
});
}
},
Controller Class ;
final StreamController<ImageController> _controllerStreamController =
StreamController<ImageController>.broadcast();
Stream<ImageController> get controllerTypeStream =>
_controllerStreamController.stream;
double rotateSync;
void setImageRotate(double rotate) {
if (selectedController == null) {
rotateSync = rotate;
_controllerStreamController.sink.add(this);
}
}
Offset offset;
void setImageOffset(Offset rotate) {
if (selectedController == null) {
offset = rotate;
_controllerStreamController.sink.add(this);
}
}
double scaleSync;
void setImageScale(double scale) {
if (selectedController == null) {
scaleSync = scale;
_controllerStreamController.sink.add(this);
}
}
And than set image widget in 'Stack' widget ;
Stack -> GestureDetector -> Draggable -> Transform.scale -> Transform.translate -> Tranform.rotate -> SizedBox(ImageWidget)