Adaptive Icon Scaling

[knyghtryda]

Since the adaptive icons seems to have extra padding when compared to their iOS counter parts I added a new scaling factor parameter so that the image for the adaptive icon can be scaled before finally scaling down to icon size. This scaling is done by enlarging the canvas, not scaling down the original image, so image quality should in theory be better. The two new yaml parameters are:

adaptive_icon_foreground_scale_factor: 0.66
adaptive_icon_foreground_scale_fill_color: "#FFFFFFFF" #probably not needed as default is fill transparent

Adding background image scaling will be next.

[Aulig]

Just tested it and seems to be working well for my use case too. @MarkOSullivan94 it'd be great if this could get merged, many people in the issue #96 would appreciate it :)

Or if you could let us know what's stopping it from getting merged?

[Aulig]

After more extensive use I think I've found a small bug. When using a non-square image as adaptive_icon_foreground, the outputted ic_launcher_foreground in the drawable folders is off-centered.

I used this configuration:

  android: true
  adaptive_icon_background: "#000000"
  adaptive_icon_foreground: "img.png"
  adaptive_icon_foreground_scale_factor: 0.66
  adaptive_icon_foreground_scale_fill_color: "#000000"

img.png is 1240x877.

Actual result (red border added for easier visibility):

Expected result (red border added for easier visibility):

I've achieved the actual result by manually padding img.png with a transparent border to make sure it is square (1240x1240)

Let me know if I'm doing anything wrong or if this is actually a bug.

Thanks for this great PR!

[tirth-stasis]

Any updates on this? @MarkOSullivan94

[dsgriffin]

few open issues mentioning this PR/adaptive icon bug (#96, #226), anyone able to take a look? @slightfoot

[knyghtryda]

After more extensive use I think I've found a small bug. When using a non-square image as adaptive_icon_foreground, the outputted ic_launcher_foreground in the drawable folders is off-centered.

I used this configuration:

  android: true
  adaptive_icon_background: "#000000"
  adaptive_icon_foreground: "img.png"
  adaptive_icon_foreground_scale_factor: 0.66
  adaptive_icon_foreground_scale_fill_color: "#000000"

img.png is 1240x877.

Actual result (red border added for easier visibility):

Expected result (red border added for easier visibility):

I've achieved the actual result by manually padding img.png with a transparent border to make sure it is square (1240x1240)

Let me know if I'm doing anything wrong or if this is actually a bug.

Thanks for this great PR!

@Aulig I do believe all icons (including adaptive) expect square input files. I would put your image on a square canvas before using it to generate the adaptive icon.

[Aulig]

After more extensive use I think I've found a small bug. When using a non-square image as adaptive_icon_foreground, the outputted ic_launcher_foreground in the drawable folders is off-centered.
I used this configuration:

  android: true
  adaptive_icon_background: "#000000"
  adaptive_icon_foreground: "img.png"
  adaptive_icon_foreground_scale_factor: 0.66
  adaptive_icon_foreground_scale_fill_color: "#000000"

img.png is 1240x877.
Actual result (red border added for easier visibility):

Expected result (red border added for easier visibility):

I've achieved the actual result by manually padding img.png with a transparent border to make sure it is square (1240x1240)
Let me know if I'm doing anything wrong or if this is actually a bug.
Thanks for this great PR!

@Aulig I do believe all icons (including adaptive) expect square input files. I would put your image on a square canvas before using it to generate the adaptive icon.

Yea, that's what I'm doing now :) Thanks for the info - in that case it makes sense that this PR doesn't handle it separately.

[knyghtryda]

Yea, that's what I'm doing now :) Thanks for the info - in that case it makes sense that this PR doesn't handle it separately.

@Aulig Now, to be fair, there was a bug in my code for the scaling that caused non-square photos to be scaled incorrectly 😛 I am now enforcing a square canvas just to make everyone's life easier 😃

[tirth-stasis]

It's May 2021 and it's still not merged. :D

[SimonIT]

Works like a charm.
I merged master into this branch in my own fork if someone want's to use an up-to-date version or @MarkOSullivan94 want's to merge it without the conflicts

[tirth-stasis]

@knyghtryda 🎉 🎉

[MarkOSullivan94]

@knyghtryda could you please provide an image which has issues with the scaling? 🙂

It'll make it easy for me to test this and see the before vs after.

Definitely should provide some kind of info on the README so if people are running into similar issues they can make use of the changes you have implemented here 🥳

[AdamBridges]

@knyghtryda could you please provide an image which has issues with the scaling? 🙂

It'll make it easy for me to test this and see the before vs after.

Definitely should provide some kind of info on the README so if people are running into similar issues they can make use of the changes you have implemented here 🥳

@MarkOSullivan94 I'm getting the same result after adding the scale factor with the following image not scaling for me:

Current configuration:

flutter_icons:
android: true
ios: true
image_path: "assets/images/logo_192x192.png"
adaptive_icon_background: "#275DAD"
adaptive_icon_foreground: "assets/images/AchooLogo_foreground_512x512.png"
adaptive_icon_foreground_scale_factor: 0.66
adaptive_icon_foreground_scale_fill_color: "#000000"

Result:

[devj3ns]

Hey @MarkOSullivan94, I hope you are doing well.

Is there a chance this PR gets merged in the near future? :)

There are many open Issues which are related to this PR.

[bradintheusa]

I'll start taking a look at this.

[RatakondalaArun]

@MarkOSullivan94 we may need to add this to our roadmap

workaround #181 (comment)