Build Powerful Drawing Apps Easily with sketch_flow — A Flutter Sketching Plugin with Export Support

Hi Flutter devs!

I’d like to introduce sketch_flow, a powerful and flexible Flutter plugin to help you build sketching and drawing apps with minimal effort. If you want to add drawing features to your app, including tools like pencil, brush, eraser, shapes, and export your sketches in PNG, SVG, or JSON formats, this package could be a great fit.

Why use sketch_flow?

  • Easy to integrate: Just create a SketchController and pass it to SketchBoard widget to enable drawing.
  • Comprehensive toolset: Includes pencil, brush, highlighter, eraser, shapes (line, rectangle, circle), move (pan/zoom), and color palette.
  • Stylish built-in UI: Ready-made top and bottom bars for quick prototyping with clean and user-friendly design. Or customize UI freely by using controller directly.
  • Powerful export/import:
    • Export sketches as high-resolution PNG images with customizable resolution.
    • Export as scalable SVG vector graphics.
    • Serialize and deserialize precise stroke data as JSON for replay or saving.

Preview

aaa

How it works

final SketchController _controller = SketchController();
final GlobalKey _repaintKey = GlobalKey();

SketchBoard(
  controller: _controller,
  repaintKey: _repaintKey,
);

Scaffold(
  appBar: SketchTopBar(controller: _controller),
  body: SketchBoard(controller: _controller),
  bottomNavigationBar: SketchBottomBar(controller: _controller),
);

  • The controller manages all drawing states and provides methods to export/import data.
  • Use extractPNG(), extractSVG(), and toJson() methods to get your drawing data in various formats easily.

Where to get it


Who is this for?

  • Anyone building Flutter apps that need sketching/drawing features.
  • Developers wanting quick prototyping with ready UI components.
  • Projects that require exporting drawings for sharing, saving, or further processing.

Feel free to ask any questions or share your feedback! I’m eager to hear how you use it or what features you’d like to see next.

Happy sketching! :artist_palette::rocket: