compositeImage not working iOS in flutter 3.19.5

[luciano-cervantes]

I recently updated the Flutter version to 3.19.5 and when running with impeller activated (which is the default) it behaves differently than expected, see the images.

Impeller off:

Impeller on:

My code:

List<List<int>> _toColumnFormat(Image imgSrc, int lineHeight) {
    final Image image = Image.from(imgSrc); // make a copy

    // Determine new width: closest integer that is divisible by lineHeight
    final int widthPx = (image.width + lineHeight) - (image.width % lineHeight);
    final int heightPx = image.height;

    // Create a black bottom layer
    final biggerImage = copyResize(image, width: widthPx, height: heightPx);

    fill(biggerImage, color: ColorRgb8(0, 0, 0));

    // Insert source image into bigger one
    compositeImage(biggerImage, image, dstX: 0, dstY: 0);

    int left = 0;
    final List<List<int>> blobs = [];

    while (left < widthPx) {
      final Image slice = copyCrop(biggerImage, x: left, y: 0, width: lineHeight, height: heightPx);

      grayscale(slice);

      final imgBinary = slice.convert(numChannels: 1);

      final bytes = imgBinary.getBytes();

      blobs.add(bytes);

      left += lineHeight;
    }

    return blobs;
  }

[brendan-duncan]

I'll take a look

[luciano-cervantes]

Hello @brendan-duncan, were you able to reproduce the error?

If you need more information let me know.

[brendan-duncan]

Sorry, I got busy by work and haven't had a chance yet.

I don't know much about Flutter. What is impeller?

[luciano-cervantes]

Impeller is the new rendering engine that Flutter is using, it is currently only being used on iOS. Here is a link with an explanation of Flutter itself

https://docs.flutter.dev/perf/impeller#:~:text=Additional%20information-,What%20is%20Impeller%3F,don't%20compile%20at%20runtime.

[brendan-duncan]

If I were to guess I'd say the black is getting alpha blended with Impeller. It doesn't make all that much sense because you're converting it to a 1 channel image before sending the bytes, but that's what it looks like it's doing. I don't know what you're doing with the bytes from _toColumnFormat.

If I were to clean this up, and I don't know if it will help the impeller issue or not, I would write it as:

List<List<int>> _toColumnFormat(Image image, int lineHeight) {
    // No need to make a copy, you're not modifying image

    // Determine new width: closest integer that is divisible by lineHeight
    final int widthPx = (image.width + lineHeight) - (image.width % lineHeight);
    final int heightPx = image.height;

    // Create a black bottom layer
    final biggerImage = Image(width: widthPx, height: hieghtPx); // defaults to 3 channel, no alpha
    // The default pixel values will be 0 for a new image

    // Insert source image into bigger one
    compositeImage(biggerImage, image, dstX: 0, dstY: 0);
    
    grayscale(biggerImage); // Might as well filter the entire image instead of per crop
    final imgBinary = biggerImage.convert(numChannels: 1); // Might as well convert the entire image, less work for crop

    int left = 0;
    final List<List<int>> blobs = [];

    while (left < widthPx) {
      final Image slice = copyCrop(biggerImage, x: left, y: 0, width: lineHeight, height: heightPx);

      final bytes = slice.getBytes();

      blobs.add(bytes);

      left += lineHeight;
    }

    return blobs;
  }