Draw and interact with SVG in Flutter

Question

We are developing an application which displays a human body, based on a SVG input. This human body is divided in several regions, think of a head, left-arm, right-arm, belly et

Answer 1

I made it working by using the built_path library, which precompiles SVG paths into Path objects. We then wrapped it into a ClipPath Widget as follows:

return GestureDetector(
    onTap: () => _bodyPartTapped(part),
    child: ClipPath(
        child: Stack(children: <Widget>[
          Container(
              color: pressedBodyPart == part
                  ? Colors.blue
                  : Colors.transparent),
          CustomPaint(painter: PathPainter(path))
        ]),
        clipper: PathClipper(path)));

It will color a body part blue if it's pressed, which is working perfectly fine.

I have created a full example which can be found here: https://github.com/gi097/flutter_clickable_regions