image_cropper_view
A widget to crop your images.
Features
- Supports pan, zoom, rotate gestures to position your image
- Works on desktop, mouse wheel to zoom, ctrl + mouse wheel to rotate
- Only dart code included, no native dependency
- Configurable control buttons
- Support setting clip shape to either circle, rect, or rrect
Getting started
Most likely you will use this as a new route to clip your image.
Usage
var data = await Navigator.of(context)
.push<ByteData>(MaterialPageRoute(builder: (contex) {
return ImageCropper(
image: Image.asset('assets/images/coffee.webp'),
exportSize: const Size(400, 400),
clipShape: ClipShape.circle,
);
}));
if (data != null) {
// now data is a ByteData of png image
var imageData = data.buffer.asUint8List();
// you can display the image like this
var img = Image.memory(imageData);
}
Full options
image: An image object to crop
exportSize: How big you want the cropped image to be
clipShape: The shape of the clipped image circle, rect or rrect
clipImage: By default, the clip only affect preview, setting this to true also clip exported image
clipRRectRadius: If clipShape is rrect, you can use this to specify a radius for the rrect
exportBackgroundColor: backgroundColor for the exported image, if there's transparent pixels