Is there a good walkthrough on getting adaptive icons working with android?
We had our icon guy give me a front image and a background image. I know I need to get android studio involved. anybody get this working?
Trying to follow the step by step here
Now the best answer one, but another one below.
It won’t build with this line.
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/app_name" android:roundIcon="@mipmap/app_name_round" />
</edit-config>
I changed the icon names from ir_luncher so I can’t tell what that is actually looking for.
Also I’m on my cordova android is 6.3 do you need to have a different version?
Anybody able to get Adaptive Icons working with Ionic? What version of Cordova Android are you using?
FINALLY got this working. Took a lot of tweaking. Here is what I did.
First this working using cordova-android 6.3.0. If you have version 7 I’m not sure if this will work the same.
I did follow the stack overflow steps that can be found in the link above. Scroll down to the steps, even though the best answer does have the finally config.xml.
After getting the all setup up I couldn’t build, had to make tweaks.
Most of the changes I had to make were just not using the paths that I copied and pasted from Stackoverflow
For
<edit-config file="app/src/main/AndroidManifest.xml"
Took a path out. New way.
<edit-config file=“AndroidManifest.xml” …
Similar with the icons
<resource-file src="./resources/EFS/icons/pay/android/res/mipmap-mdpi/ic_launcher_background.png" target="res/mipmap-mdpi/ic_launcher_background.png" />
In the android platform folder there is a res folded. I set it up to copy the images to this folder.
(I had this all setup and added and removed my platform again, this seems to setup these new folders).
You should be able to build and get the new icons.
Note, it seems like Ionic is adding its own default icon to all of these folders (/res/mipmap-mdpi/ …/res/mipmap-xxhdpi/icon.png … ) And leaves an old res/mipmap-ldpi that does not appear to be needed anymore (anybody else confirm?)
I deleted those.
Tested with a Pixel 2 (kind of fun dragging the icon around and watching the front layer follow the icon around)
Also with Samsung S5 (with Android 5.0) to verify legacy icons.
In case anyone else is going through this process, Cordova now supports Android adaptive app icons without so much fussing about. Here’s the section in their official documentation.
For my app, these are the only lines that needed to be updated in Config.xml - to add the background and foreground properties. src is still used for “flattened” icons on Android devices that do not support adaptive icons.
<icon background="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_background.png" density="mdpi" foreground="resources/android/adaptiveicon/mipmap-mdpi/ic_launcher_foreground.png" src="resources/android/icon/drawable-mdpi-icon.png" />
<icon background="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_background.png" density="hdpi" foreground="resources/android/adaptiveicon/mipmap-hdpi/ic_launcher_foreground.png" src="resources/android/icon/drawable-hdpi-icon.png" />
<icon background="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_background.png" density="xhdpi" foreground="resources/android/adaptiveicon/mipmap-xhdpi/ic_launcher_foreground.png" src="resources/android/icon/drawable-xhdpi-icon.png" />
<icon background="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_background.png" density="xxhdpi" foreground="resources/android/adaptiveicon/mipmap-xxhdpi/ic_launcher_foreground.png" src="resources/android/icon/drawable-xxhdpi-icon.png" />
<icon background="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_background.png" density="xxxhdpi" foreground="resources/android/adaptiveicon/mipmap-xxxhdpi/ic_launcher_foreground.png" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
1 Like
Maybe this will help:
Which version of cordova-android does Adaptive Icons work with?
I’m now trying to upgrade cordova-android from 6.4 to 8.0 The config.xml values did not work. (Back to merging with AndroidManafest).
Do we need to specify the round icon or does android take care of that (with the new foreground and foreground images)
Still having a problem getting adaptive icons working with cordova Android 8.0. I’m doing similar to what talisman-andre is doing but on the pixel 2 its still using the source Icon, not the round image it had before.
Android studio seems to generate 4 images. ic_launcher for older apps, ic_luncher background, ic_luncher_foreground, ic_luncher_round.
We are only using three. I get a white circle with the background and foreground icons in side it, instead of just using the round icon.
Anything else that needs to be set up?
look here https://www.npmjs.com/package/cordova-res
you need to generate icons with this command cordova-res android --type adaptive-icon
android@8.0.0
cordova@9.0.0
2 Likes
I have android 8.0 and cordova 8.0. What does the Config.xml look like for this to work? Trying to avoid adding more plugins.
update your global cordova with this command npm i -g cordova@latest and try again
Is there no way to do it with Android 8 and Cordova 8?
This worked before with Android 6.4 and Cordova 7.
Had to have this line in the config.xml.
I can see that does not work any more with the new folder lay out.
do you have these lines in your config.xml ?
<resource-file src="resources/android/notification/drawable-hdpi/notification_icon.png" target="app/src/main/res/drawable-hdpi/notification_icon.png" />
<resource-file src="resources/android/notification/drawable-mdpi/notification_icon.png" target="app/src/main/res/drawable-mdpi/notification_icon.png" />
<resource-file src="resources/android/notification/drawable-xhdpi/notification_icon.png" target="app/src/main/res/drawable-xhdpi/notification_icon.png" />
<resource-file src="resources/android/notification/drawable-xxhdpi/notification_icon.png" target="app/src/main/res/drawable-xxhdpi/notification_icon.png" />
<resource-file src="resources/android/notification/drawable-xxxhdpi/notification_icon.png" target="app/src/main/res/drawable-xxxhdpi/notification_icon.png" />
<icon background="resources\android\icon\ldpi-background.png" density="ldpi" foreground="resources\android\icon\ldpi-foreground.png" />
<icon background="resources\android\icon\mdpi-background.png" density="mdpi" foreground="resources\android\icon\mdpi-foreground.png" />
<icon background="resources\android\icon\hdpi-background.png" density="hdpi" foreground="resources\android\icon\hdpi-foreground.png" />
<icon background="resources\android\icon\xhdpi-background.png" density="xhdpi" foreground="resources\android\icon\xhdpi-foreground.png" />
<icon background="resources\android\icon\xxhdpi-background.png" density="xxhdpi" foreground="resources\android\icon\xxhdpi-foreground.png" />
<icon background="resources\android\icon\xxxhdpi-background.png" density="xxxhdpi" foreground="resources\android\icon\xxxhdpi-foreground.png" />
Sorry finally got time to look at this again.
For our icons we have lines like this.
> <icon background="./resources/app/icons/pay/android/res/mipmap-mdpi/ic_launcher_background.png" density="mdpi" foreground="./resources/app/icons/pay/android/res/mipmap-hdpi/ic_launcher_foreground.png" src="./resources/app/icons/pay/android/res/mipmap-mdpi/ic_launcher.png" />
I was told that using src is what older phones would use or something. I can try it with out that.
No luck. Still can’t get the round icons to show up on pixel phones.
Hello Team this is about ionic v5,
Everything I have configured properly, foreground and background images are generating too but when I build the project foreground and background images are getting deleted. In the same way I have created adaptive icons in ionic v3.
Thank you so much. This is the only working solution I could find !