feat: Added support for generating android adaptive icons
PR Checklist
- [x] The PR title follows our guidelines: https://github.com/NativeScript/NativeScript/blob/master/tools/notes/CONTRIBUTING.md#commit-messages.
- [x] There is an issue for the bug/feature this PR is for. To avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it.
- [x] You have signed the CLA.
- [x] All existing tests are passing: https://github.com/NativeScript/nativescript-cli/blob/master/CONTRIBUTING.md#contribute-to-the-code-base
- [ ] Tests for the changes are included.
What is the current behavior?
Command ns resources generate icons <source image path> cannot generate app launcher icons ever since the adaptive icons addition (ic_launcher). Right now, developers have no ways to generate android launcher icons apart from using Android Studio.
What is the new behavior?
Command ns resources generate icons <source image path> will generate all needed icons.
According to google, adaptive icons have few requirements:
- Both layers must be sized at 108 x 108 dp.
- The inner 72 x 72 dp of the icon appears within the masked viewport.
- The system reserves the outer 18 dp on each of the 4 sides to create interesting visual effects, such as parallax or pulsing.
In order to comply with these requirements, I updated image-definitions.json using the following concept:
- Source image will also be used to create an
ic_launcher_foregroundresized to 72 dp converted to pixels. - A new resize operation called
outerScalewas added to CLI. Using this operation, we can scale the outer part of the image (it's a bottom layer actually), which will become an opaque layer using hex#00000000. - Scale is set to 1.5x to resize image (but not the inner content) to pixels that equal to 108dp according to device dpi. (72dp x 1.5 = 108dp)
Fixes/Implements/Closes #5571.
this PR is quite useful, now the icon generation is broken and it is quite annoying to execute the command and not see the change in the application
@NathanWalker I know there's been a discussion about a different approach but perhaps we could give this one a try until then.
This PR is trying to follow the principles described in this guide: https://developer.android.com/guide/practices/ui_guidelines/icon_design_adaptive
These new dimensions equal to size of inner content of foreground layer which has to be 72dp.
New values inside image-definitions file make sense according to "dp to pixels" conversion board:

Multiplying those by 1.5 during asset generation gives us the right pixels for both layers size that equal to 108dp. Inner icon will maintain its size of 72dp.
An example of new android asset definitions:
{
"width": 144,
"height": 144,
"directory": "drawable-xhdpi",
"filename": "ic_launcher_foreground.png",
"resizeOperation": "outerScale",
"scale": "1.5x"
}
It's using the existing asset generation API with the addition of new outerScale type of resizeOperation.
@NathanWalker I have applied my final changes on this one.
Few details regarding android icons.
CLI did not generate icons unless it found old icons with identical names in file system. This is actually a feature that was introduced here: https://github.com/NativeScript/nativescript-cli/commit/075686c6fe7a69928669993a5c2f10473b1c8645 This was really confusing and frustrating, and was the reason for all open tickets to begin with. I took the liberty and removed that check so that asset definitions are always generated but if we still need it I can add it back.
Regarding the output content, it generates simple icons whose rendering is similar to the one of the 'legacy icons' used in old app templates (icon.png). If a developer wants to create more complex adaptive icons, Android Studio is still the preferred choice.
this PR is quite useful, now the icon generation is broken and it is quite annoying to execute the command and not see the change in the application
You can test and post feedback if you like using my branch: https://github.com/CatchABus/nativescript-cli/tree/android-generate-icons-fix
It will need building TS and using command from repo bin directory.
Hi! I'm also running into this issue. Is there a plan to release these fixes?