Skip to content

lmanliang/flutter_canvas_to_image

 
 

Repository files navigation

canvas_to_image

a simple Flutter canvas to png file example

screen

final recorder = new ui.PictureRecorder();
final canvas = new Canvas(
    recorder,
    new Rect.fromPoints(
        new Offset(0.0, 0.0), new Offset(200.0, 200.0)));

final stroke = new Paint()
  ..color = Colors.grey
  ..style = PaintingStyle.stroke;

canvas.drawRect(
    new Rect.fromLTWH(0.0, 0.0, 200.0, 200.0), stroke);

final paint = new Paint()
  ..color = color
  ..style = PaintingStyle.fill;

canvas.drawCircle(
    new Offset(
      widget.rd.nextDouble() * 200.0,
      widget.rd.nextDouble() * 200.0,
    ),
    20.0,
    paint);

final picture = recorder.endRecording();
final img = picture.toImage(200, 200);
final pngBytes = await img.toByteData(format: new ui.EncodingFormat.png());

In this example the image is displayed in a Image.memory widget

new Image.memory(new Uint8List.view(imgBytes.buffer));

Getting Started with Flutter

For help getting started with Flutter, view our online documentation.

About

flutter example : canvas to png

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Dart 74.2%
  • Objective-C 17.3%
  • Java 8.5%