handwriting_answer_pad 0.1.1

A Flutter handwriting capture pad (scribble-based) with undo/redo, clear, render-to-image, and a pluggable recognizer hook — bring your own OCR / vision model. No backend coupling.

✍️ handwriting_answer_pad

A Flutter handwriting capture pad with a pluggable recognizer

A drawing canvas with undo / redo / clear and a "recognize" action — bring your own OCR or vision model. The pad never talks to a backend itself, so it stays decoupled and testable.

---

Great for math answers, signatures, quick sketches, or anything you want to turn into text.

Features

• 🖊️ Smooth freehand drawing (built on scribble)
• ↩️ Undo / ↪️ redo / 🧹 clear, with buttons that enable/disable correctly
• ✨ "Recognize" action that renders the strokes to a PNG and runs your recognizer
• 🔌 No OpenAI/Firebase coupling — you inject the recognizer
• 🧪 Test-friendly: a capture seam lets you exercise recognition headlessly
• 🙈 Errors are caught and shown as a friendly message (raw exceptions never leak)

Install

dependencies:
  handwriting_answer_pad: ^0.1.1

or flutter pub add handwriting_answer_pad.

Usage

import 'dart:typed_data';
import 'package:handwriting_answer_pad/handwriting_answer_pad.dart';

HandwritingAnswerPad(
  recognizer: (Uint8List pngBytes) async {
    // Send the rendered handwriting to your OCR / vision model and return text.
    return await myVisionApi.imageToText(pngBytes);
  },
  onResult: (text) => print('Recognized: $text'),
);

The widget renders the strokes to a PNG and hands the bytes to your recognizer; the returned text is shown below the pad.

Programmatic control

final controller = HandwritingPadController(strokeWidth: 4);

HandwritingAnswerPad(controller: controller, recognizer: myRecognizer);

controller.undo();
controller.clear();
final png = await controller.renderPng(); // capture the drawing yourself
controller.dispose();                     // if you created it

Tips

• Pair with image_white_background to give vision models an opaque canvas, and with ai_rubric_grader to grade the recognized answer.
• Run recognition (and any API key) server-side; pass only the image up and the text back.

Part of the Flutter Grading Toolkit.

Contributing

Issues and PRs welcome. Run flutter test before submitting.

License

MIT © 2026 Muhammad Ali