Flutter: Unhandled Exception: type '_ByteDataView' is not a subtype of type 'Uint8Lis-CodePudding

I am trying to create a custom marker with Round Image File

However, I am running into the [VERBOSE-2:ui_dart_state.cc(209)] Unhandled Exception: type '_ByteDataView' is not a subtype of type 'Uint8List' error.

  resizeImage(Uint8List file,
      {int size = 150,
      bool addBorder = true,
      Color borderColor = Colors.orange,
      double borderSize = 20,
      Color titleColor = Colors.white,
      Color titleBackgroundColor = Colors.black}) async {
    final ui.PictureRecorder pictureRecorder = ui.PictureRecorder();
    final Canvas canvas = Canvas(pictureRecorder);
    final Paint paint = Paint()..color;
    final double radius = size / 2;

    //make canvas clip path to prevent image drawing over the circle
    final Path clipPath = Path();
    clipPath.addRRect(RRect.fromRectAndRadius(
        Rect.fromLTWH(0, 0, size.toDouble(), size.toDouble()),
        Radius.circular(100)));
    canvas.clipPath(clipPath);

    //paintImage

    ui.Codec codec = await ui.instantiateImageCodec(file);
    ui.FrameInfo frame = await codec.getNextFrame();

    paintImage(
        canvas: canvas,
        rect: Rect.fromLTWH(0, 0, size.toDouble(), size.toDouble()),
        image: frame.image);

    if (addBorder) {
      //draw Border
      paint..color = borderColor;
      paint..style = PaintingStyle.stroke;
      paint..strokeWidth = borderSize;
      canvas.drawCircle(Offset(radius, radius), radius, paint);
    }

    //convert canvas as PNG bytes
    final _image = await pictureRecorder
        .endRecording()
        .toImage(size, (size * 1.1).toInt());
    final data = await _image.toByteData(format: ui.ImageByteFormat.png);

    //convert PNG bytes as BitmapDescriptor
    return data;
  }

I'd tried with the asset images, network image and more. All have the errors. I've checked with other people's questions. However, I have no clue what are the differences and suddenly I am getting these errors?

What have I done wrong here and how can make it work?

CodePudding user response：

Your function returns Future<ByteData?> so let the compiler help you by declaring that as the return type. My guess is that where you use the function you are expecting the result to be Uint8List. If you change that, the compiler should help you find it.

Here's an updated and tidied version (with clearer cascades, removal of obvious types etc)

Future<ByteData?> resizeImage(
  Uint8List file, {
  int size = 150,
  bool addBorder = true,
  Color borderColor = Colors.orange,
  double borderSize = 20,
  Color titleColor = Colors.white,
  Color titleBackgroundColor = Colors.black,
}) async {
  final pictureRecorder = ui.PictureRecorder();
  final canvas = Canvas(pictureRecorder);

  //make canvas clip path to prevent image drawing over the circle
  canvas.clipPath(
    Path()
      ..addRRect(RRect.fromRectAndRadius(
        Rect.fromLTWH(0, 0, size.toDouble(), size.toDouble()),
        const Radius.circular(100),
      )),
  );

  //paintImage
  final codec = await ui.instantiateImageCodec(file);
  final frame = await codec.getNextFrame();

  paintImage(
    canvas: canvas,
    rect: Rect.fromLTWH(0, 0, size.toDouble(), size.toDouble()),
    image: frame.image,
  );

  if (addBorder) {
    //draw Border
    final radius = size / 2;

    final paint = Paint()
      ..color = borderColor
      ..style = PaintingStyle.stroke
      ..strokeWidth = borderSize;
    canvas.drawCircle(Offset(radius, radius), radius, paint);
  }

  //convert canvas as PNG bytes
  final _image = await pictureRecorder.endRecording().toImage(
        size,
        (size * 1.1).toInt(),
      );

  return await _image.toByteData(format: ui.ImageByteFormat.png);
}