3

//first the code i write .

class  AreaPainter extends CustomPainter{
List<Offset> points;
bool clear;
bool iscrop;
final ui.Image image;
BuildContext context;
AreaPainter(@required this.image,@required  this.clear,@required this.points,@required  `this.iscrop,@required  this.context);`
  @override
  void paint(Canvas canvas, Size size) async {
    final paint = Paint()
      ..color = Colors.blue

      ..strokeCap = StrokeCap.square
      ..style = PaintingStyle.fill
      ..strokeWidth = 2;

  
    final ui.Rect rect = ui.Offset.zero & size;
    final Size imageSize = new Size(image.width.toDouble(), image.height.toDouble());

    FittedSizes sizes = applyBoxFit(BoxFit.cover, imageSize, size);

    // if you don't want it centered for some reason change this.
    final Rect inputSubrect = Alignment.center.inscribe(sizes.source, Offset.zero & imageSize);
    final Rect outputSubrect = Alignment.center.inscribe(sizes.destination, rect);
    canvas.drawImageRect(image, inputSubrect, outputSubrect, new Paint());


    if (iscrop == false){
      canvas.drawImageRect(image, inputSubrect, outputSubrect, paint);
      if (!clear) {
        print("drawing draggable rect");
        final circlePaint = Paint()
          ..color = Colors.lightBlueAccent
          ..strokeCap = StrokeCap.square
          ..style = PaintingStyle.fill
          ..blendMode = BlendMode.multiply
          ..strokeWidth = 1;

        for (int i = 0; i < points.length; i++) {
          if (i + 1 == points.length) {
            canvas.drawLine(points[i], points[0], paint);
          } else {
            canvas.drawLine(points[i], points[i + 1], paint);
          }
          canvas.drawCircle(points[i], 10, circlePaint);
        }
      }

  }
    else{


      final path_obj = Path();
      print("croping !!!!!!!!!!!!!");

      final recorder = ui.PictureRecorder();
      canvas = Canvas(recorder);

      var dpr = ui.window.devicePixelRatio;





      path_obj.moveTo(points[0].dx,points[0].dy);
      path_obj.lineTo(points[1].dx,points[1].dy);
      path_obj.lineTo(points[2].dx,points[2].dy);
      path_obj.lineTo(points[3].dx,points[3].dy);
      path_obj.lineTo(points[0].dx,points[0].dy);


      canvas.drawPath(path_obj, paint);
      canvas.clipPath(path_obj);
      var size_ = context.size;
      canvas.drawImageRect(image, inputSubrect, outputSubrect, paint);
      final picture = recorder.endRecording();


      final img = await picture.toImage(size.width.floor(), size.height.floor());
      final pngBytes = await img.toByteData(format: ImageByteFormat.png);
      Uint8List bytes = pngBytes.buffer.asUint8List();

      final directory = await getExternalStorageDirectory();
      print("my directory !!!!!!!!!!!! ${directory}");
      final myImagePath = '${directory.path}/MyImages' ;
      //   File("/storage/emulated/0/foldername/imagename.png").writeAsBytes(bytes);

      await new Directory(myImagePath).create();
      new File("$myImagePath/image_2.jpg").writeAsBytes(bytes);
      Navigator.push(context, new MaterialPageRoute(builder: (_)=>Show(pngBytes: bytes,)));


    }
  }

//now the output i get

//image before saving :- enter image description here

//image after saving or recording from canvas:- enter image description here

just look at the quality difference between above two images. i am also using clipping here but without clipping i also get same blurry image variant of original image.

4

0 回答 0