search

apache / cordova-android

Apache Cordova Android
https://cordova.apache.org/
Apache License 2.0
3.59k stars 1.52k forks source link

Adaptive Icon not working with cordova-android 12 #1616

Closed jamesfdickinson closed 10 months ago

jamesfdickinson commented 11 months ago

Bug Report

Error: "One of the following attributes are set but missing the other for the density type: mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi. Please ensure that all required attributes are defined."

Problem

The adaptive icon is missing the background and the foreground is small with cordova-android 12.  The adaptive icon works properly with cordova-android 11.

What is expected to happen?

ic_launcher_background and ic_launcher_foreground assets are copied to the build.

What does actually happen?

Only ic_launcher is created and copied and not ic_launcher_background and ic_launcher_foreground.

Information

Config.xml

        <icon background="resources/android/icon/mipmap-mdpi/ic_launcher_background.png" density="mdpi" foreground="resources/android/icon/mipmap-mdpi/ic_launcher_foreground.png" />
        <icon background="resources/android/icon/mipmap-hdpi/ic_launcher_background.png" density="hdpi" foreground="resources/android/icon/mipmap-hdpi/ic_launcher_foreground.png" />
        <icon background="resources/android/icon/mipmap-xhdpi/ic_launcher_background.png" density="xhdpi" foreground="resources/android/icon/mipmap-xhdpi/ic_launcher_foreground.png" />
        <icon background="resources/android/icon/mipmap-xxhdpi/ic_launcher_background.png" density="xxhdpi" foreground="resources/android/icon/mipmap-xxhdpi/ic_launcher_foreground.png" />
        <icon background="resources/android/icon/mipmap-xxxhdpi/ic_launcher_background.png" density="xxxhdpi" foreground="resources/android/icon/mipmap-xxxhdpi/ic_launcher_foreground.png" />

Command or Code

Environment, Platform, Device

Dev environment: Windows 10 Target platform: Android

Version information

cordova-android 12.0.0 cordova-cli 12

Checklist

breautek commented 11 months ago

Was able to reproduce the issue locally. I believe this is a regression from our https://github.com/apache/cordova-android/pull/1550 update. I didn't notice it was an issue before since I have a src fallback.

Until a patch is made, I think there are two workarounds:

  1. Include a src attribute to your icons, which should be a full android drawable (either a rasterized PNG, and I believe android's AVD is also suppported). This will include icons for pre API 26 devices (and will also apply to API 26+ devices if the adaptive icons aren't present, which due to this bug they aren't). This of course has the caveat that your icons won't be adaptive icons and animations and such won't apply.
  2. If you include a monochrome icon via the monochrome attribute which should lead to an android drawable that is a black and white version of your icon, then the adaptive icons do work as expected (you'll have res/mipmap-<density>-v26/ with the background, foreground resources with the ic_launcher.xml that defines the adaptive icon. API 33 devices with themes enabled will use this icon to produce a themeable icon that works in light mode, dark mode, and their choice of primary colour.

It isn't intended for monochrome icon to be required to use adaptive icons. So specifying just the background and foreground attributes is suppose to continue to work as it did before, so I've marked this as a bug and will add this issue to a 12.0.1 milestone.

jamesfdickinson commented 11 months ago

Number 2 workaround including a monochrome icon resolved the adaptive icon bug.

Thank you for the quick reply. I had reverted back to cordova-android 11, but with the workaround I was able to cleanly deploy with cordova-android 12. It was a little more work than I was planning. On the plus side, my app now supports themed icons (monochrome icons).

KoreLewi commented 11 months ago

I have the same problem.

I'm using Cordova 10.0.0 (cordova-lib@10.1.0) with Cordova platform android 11.0.0, and I'm getting the same error message for the following code:

<icon background="res/android/bcg.png" density="ldpi" src="res/android/ldpi.png" />
        <icon background="res/android/bcg.png" density="mdpi" src="res/android/mdpi.png" />
        <icon background="res/android/bcg.png" density="hdpi" src="res/android/hdpi.png" />
        <icon background="res/android/bcg.png" density="xhdpi" src="res/android/xhdpi.png" />
        <icon background="res/android/bcg.png" density="xxhdpi" src="res/android/xxhdpi.png" />
        <icon background="res/android/bcg.png" density="xxxhdpi" src="res/android/xxxhdpi.png" />

"One of the following attributes are set but missing the other for the density type: mdpi, hdpi, xhdpi, xxhdpi, xxxhdpi. Please ensure that all required attributes are defined."

I'm relatively new to Cordova, I want to deploy a quasar application with predefined icon background color.

breautek commented 11 months ago

background refers to the background part of an adaptive icon. It must be paired with a foreground attribute. And due to this bug, on cordova-android@12 you'll also need the monochrome icon defined as well, but it isn't intended for you to require the monochrome icon to use adaptive icons. See https://cordova.apache.org/docs/en/11.x/config_ref/images.html#android for more information.

I'm hiding both of your post and this post because they are off-topic to the original issue. If you have any further questions please use the discussions board

breautek commented 11 months ago

Number 2 workaround including a monochrome icon resolved the adaptive icon bug.

Thank you for the quick reply. I had reverted back to cordova-android 11, but with the workaround I was able to cleanly deploy with cordova-android 12. It was a little more work than I was planning. On the plus side, my app now supports themed icons (monochrome icons).

Glad it works for you, and as a side effect you're more compliant with the android app ecosystem.

But yah, the intended behaviour is to to require foreground and background if either is defined, but not require monochrome. However, monochrome does require an adaptive icon, so if monochrome is defined, it must also have background and foreground defined. Obviously that's not the actual case here, and that's not documented as a breaking change.

I don't know if I'll have time this weekend to look into it, but it is something I'm planning on tackling soon (perhaps the following weekend).

EYALIN commented 10 months ago

@breautek is there any news regarding the icon?

tkem commented 10 months ago

I'm also wondering, what would be the correct format for a "monochrome" PNG? Grayscale, indexed, or what?

breautek commented 10 months ago

I'm also wondering, what would be the correct format for a "monochrome" PNG? Grayscale, indexed, or what?

The monochrome should be the same as your foreground adaptive icon image, except it should only consist of two colours: an transparent background and pure black.

Android will colour in the black pixels according to the user's configured Android theme.

pr0pz commented 10 months ago

I also managed to get it working but had to search deep to find out how to put an extra monochrome icon since it's not documented yet. This is my config.xml with vector based adaptive icons:

<icon foreground="xxx/ic_launcher_foreground.xml" background="xxx/ic_launcher_background.xml" monochrome="xxx/ic_launcher_monochrome.xml" density="XXX" src="xxx/XXX.png" />

The XML's are SVG's converted for android (Vector Drawable format, convert it here: https://svg2vector.com/ or in Android Studio )