image icon indicating copy to clipboard operation
image copied to clipboard

copyResizeCropSquare antialiasing issue with rounded corners

Open ekuleshov opened this issue 1 year ago • 10 comments

Thank you for adding support for rounded corners to all the square-related APIs.

I'm trying to use use the copyResizeCropSquare to add support for generating round-corners icons (as required by Apple) to the flutter_launcher_icons. Starting off 1024x1024 icon, shrinking it to 824 size and using corner radius between 180..190.

image = compositeImage(
        Image(
          width: 1024,
          height: 1024,
          numChannels: 4,
          backgroundColor: ColorUint8.rgba(0, 0, 0, 0),
        ),
        copyResizeCropSquare(
          image,
          size: 824,
          radius: 190, // 185.4,
          interpolation:
              image.width >= 824 ? Interpolation.average : Interpolation.linear,
        ),
        center: true,
      );

The composite image has transparent black background. But I get the same results with transparent white and also without the composite image. The result has some noticeable artifacts on the rounded corners.

Not sure if I'm missing something about method call parameters or this method need some additional parameter to specify background color for the transparent antialiasing for the corner arc part.

If it would help, I can try to create a simpler example or a test in the image package.

You could also take a look at my fork of the flutter_launcher_icons at https://github.com/ekuleshov/flutter_launcher_icons.git use the macos_round_corners branch. Then:

cd example/flavors
flutter create .
flutter pub run flutter_launcher_icons

The generated file is located at example/flavors/macos/Runner/Assets.xcassets/AppIcon.appiconset/app_icon_1024.png

image image

ekuleshov avatar Jan 08 '23 19:01 ekuleshov