A widget to create bounding box annotation on an image.

Preview

Live Demo : Click Here

Features

  • Draw rectangles (bounding boxes) on an image.
  • Add / edit custom text to label the annotation.
  • Get annotation details (e.g. Offset).
  • Crop image into multiple parts based on bounding boxes.
  • Delete annotation.

Usage

Create a BoundingBoxAnnotation widget, and pass the required parameters.

final AnnotationController annotationController = AnnotationController();

BoundingBoxAnnotation(
    controller: annotationController,
    imageBytes: imageBytes
)

Customize image size.

BoundingBoxAnnotation(
    controller: annotationController,
    imageBytes: imageBytes
    imageWidth: 400.0,
    imageHeight 400.0,
)

Customize annotation styles.

BoundingBoxAnnotation(
    controller: annotationController,
    imageBytes: imageBytes
    color: Colors.blue,
    strokeWidth: 5.0,
)

Create a List variable to store the annotation(s).

List<AnnottaionDetails>> annotationList = [];

Get annotation details:

final AnnotationController annotationController = AnnotationController();

List<AnnottaionDetails>> annotationList = await annotationController.getData();

Add annotation manually:

final AnnotationController annotationController = AnnotationController();
double x = 10.0
double y = 20.0
double width = 150.0
double height = 150.0
String label = "Test"

annotationController.addAnnotation(x, y, width, height, label);

Clear all annotation(s):

final AnnotationController annotationController = AnnotationController();

annotationController.clear();

Libraries

bounding_box_annotation