capacitor-assets
capacitor-assets copied to clipboard
Scaling option for Android launcher icons

Basically recreate the options under "Scaling" above for devs to provide the same icon as iOS but scale it differently when generating adaptive and legacy icons for Android. Usually, devs will want to use ~66% if they want to use the same icon for iOS and Android.
- Trim: Yes/No - trims the safe area (
--icon-foreground-trim
/--icon-background-trim
because it's specific for Android icons) - Resize: 0-400% - scales the source asset the specified amount (
--scale
?)
I'm hitting the same issue as the other guys with the zoomed in icon. Going to do the manual way for the time being but this would be a great addition. +1 from me
Is there any way to stop the app icon in android from being overly zoomed in?
Can't seem to use cordova-res at all for this and have to do it manually.
When will this be released?
Is there any way to stop the app icon in android from being overly zoomed in? Can't seem to use cordova-res at all for this and have to do it manually.
@madmacc, for the Android adaptive icon, here is my workaround:
Assume I have an original icon resource icon.512x512.png
.
Then add transparent padding for it, make sure the new icon size is 512/0.67=764
, so my icon stays in a safe area.
@arzyu thanks for the advice. If people searching for a command line tool, use imagemagick:
convert icon.png -background none -gravity center -extent 1528x1528 icon2.png
Is there any way to stop the app icon in android from being overly zoomed in? Can't seem to use cordova-res at all for this and have to do it manually.
@madmacc, for the Android adaptive icon, here is my workaround:
Assume I have an original icon resource
icon.512x512.png
. Then add transparent padding for it, make sure the new icon size is512/0.67=764
, so my icon stays in a safe area.
Here needs to be corrected, use the icon background color for padding instead of the transparent color
![]()
Basically recreate the options under "Scaling" above for devs to provide the same icon as iOS but scale it differently when generating adaptive and legacy icons for Android. Usually, devs will want to use ~66% if they want to use the same icon for iOS and Android.
- Trim: Yes/No - trims the safe area (
--icon-foreground-trim
/--icon-background-trim
because it's specific for Android icons)- Resize: 0-400% - scales the source asset the specified amount (
--scale
?)
Where do I find this configuration dialog box?
In Android Studio, right click on "Res" and then click "New" / "Image Asset".
I don't understand why the icon is scaled. There is no legit reason. The (rounded) icon shapes are always smaller than the source icon. Who had the brilliant idea to zoom the icon? 🤦♂️ Adding an option for scaling is not necessary. Just set this option to never scale. Btw. I'm from Cordova and I've never experienced such a problem. Some time ago the Android Icon appearance has been changed. The icon shapes are handled by the Android system. No need for manual rounding etc. At the transition time some legacy icons are rendered smaller with a padding. Is this scaling feature related to this? Weird... why does this not occur with Cordova? I believe there is a configuration for perfect fix. But idk ... I just want to make sure all users see the same icon on any device and OS. I would prefer smaller icons on legacy devices but never crop it. But when I adding a safe padding, the icon appears too small on some devices. Argh... For me scaling down is not really a workaround. It's just a way better than cropped icons. Because the icon is still zoomed in or out on some devices. It reverses the issue. It just looks unprofessional.
Same is for iOS imo. Look how all are equal to the source except the higher res once, those are scalled down (padding between "e" and border is higher)...

Ok found out that if you define ios/icon.png
and android/icon.png
yourself, it will override the ios Icon with the source of the Android icon which in my case has a larger padding specific to this case here. Hmm..
Maybe someone has time to test my draft which adds --android-resize
that behaves like the Android Studio resize UI.