You are viewing a plain text version of this content. The canonical link for it is here.
Posted to issues@cordova.apache.org by "kalwinskidawid (via GitHub)" <gi...@apache.org> on 2023/09/29 12:37:45 UTC
[GitHub] [cordova] kalwinskidawid created a discussion: Cordova-android how to properrly declare adaptive icon
GitHub user kalwinskidawid created a discussion: Cordova-android how to properrly declare adaptive icon
Hi,
I'm writing here because I can't find the discussion panel in the cordova-android branch.
I'm using version 12.0.1 and I have a problem with adaptive icons. I have read [#1616](https://github.com/apache/cordova-android/issues/1616), however I still can't generate a working icon.
In [documentation](https://cordova.apache.org/docs/en/12.x/config_ref/images.html#adaptive-icon-with-vectors) it says that I should do:
```xml
<platform name="android">
<resource-file src="res/values/colors.xml" target="/app/src/main/res/values/colors.xml" />
<icon monochrome="res/icon/android/ldpi-monochrome.png" background="@color/background" density="ldpi" foreground="res/icon/android/ldpi-foreground.png" />
<icon monochrome="res/icon/android/mdpi-monochrome.png" background="@color/background" density="mdpi" foreground="res/icon/android/mdpi-foreground.png" />
<icon monochrome="res/icon/android/hdpi-monochrome.png" background="@color/background" density="hdpi" foreground="res/icon/android/hdpi-foreground.png" />
<icon monochrome="res/icon/android/xhdpi-monochrome.png" background="@color/background" density="xhdpi" foreground="res/icon/android/xhdpi-foreground.png" />
<icon monochrome="res/icon/android/xxhdpi-monochrome.png" background="@color/background" density="xxhdpi" foreground="res/icon/android/xxhdpi-foreground.png" />
<icon monochrome="res/icon/android/xxxhdpi-monochrome.png" background="@color/background" density="xxxhdpi" foreground="res/icon/android/xxxhdpi-foreground.png" />
</platform>
```
However when I generate icons in Android Studio I get:

Monochrome is defined at `anydpi-v26`, so how should I define the `<icon>` attributes? I tried importing the icons via the `<resource-file>` tag and modifying the AndroidManifest without the `<icon>` tag in `config.xml`, but then I got an error that `ic_launcher.webp` already exists (the default cordova icon). I also tried:
```xml
<icon monochrome="res/android/drawable/ic_launcher_foreground.xml" background="@color/ic_launcher_background" density="mdpi"
foreground="res/android/drawable/ic_launcher_foreground.xml" src="res/android/mipmap/mdpi/ic_launcher.webp"/>
[...]
```
But it does not work as it should. Android Studio does not generate `ldpi`. How to define it correctly?
GitHub link: https://github.com/apache/cordova/discussions/435
----
This is an automatically sent email for issues@cordova.apache.org.
To unsubscribe, please send an email to: issues-unsubscribe@cordova.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: issues-unsubscribe@cordova.apache.org
For additional commands, e-mail: issues-help@cordova.apache.org
[GitHub] [cordova] kalwinskidawid edited a discussion: Cordova-android how to correctly declare an adaptive icon
Posted by "kalwinskidawid (via GitHub)" <gi...@apache.org>.
GitHub user kalwinskidawid edited a discussion: Cordova-android how to correctly declare an adaptive icon
Hi,
I'm writing here because I can't find the discussion panel in the cordova-android branch.
I'm using version 12.0.1 and I have a problem with adaptive icons. I have read [#1616](https://github.com/apache/cordova-android/issues/1616), however I still can't generate a working icon.
In [documentation](https://cordova.apache.org/docs/en/12.x/config_ref/images.html#adaptive-icon-with-vectors) it says that I should do:
```xml
<platform name="android">
<resource-file src="res/values/colors.xml" target="/app/src/main/res/values/colors.xml" />
<icon monochrome="res/icon/android/ldpi-monochrome.png" background="@color/background" density="ldpi" foreground="res/icon/android/ldpi-foreground.png" />
<icon monochrome="res/icon/android/mdpi-monochrome.png" background="@color/background" density="mdpi" foreground="res/icon/android/mdpi-foreground.png" />
<icon monochrome="res/icon/android/hdpi-monochrome.png" background="@color/background" density="hdpi" foreground="res/icon/android/hdpi-foreground.png" />
<icon monochrome="res/icon/android/xhdpi-monochrome.png" background="@color/background" density="xhdpi" foreground="res/icon/android/xhdpi-foreground.png" />
<icon monochrome="res/icon/android/xxhdpi-monochrome.png" background="@color/background" density="xxhdpi" foreground="res/icon/android/xxhdpi-foreground.png" />
<icon monochrome="res/icon/android/xxxhdpi-monochrome.png" background="@color/background" density="xxxhdpi" foreground="res/icon/android/xxxhdpi-foreground.png" />
</platform>
```
However when I generate icons in Android Studio I get:

Monochrome is defined at `anydpi-v26`, so how should I define the `<icon>` attributes? I tried importing the icons via the `<resource-file>` tag and modifying the AndroidManifest without the `<icon>` tag in `config.xml`, but then I got an error that `ic_launcher.webp` already exists (the default cordova icon). I also tried:
```xml
<icon monochrome="res/android/drawable/ic_launcher_foreground.xml" background="@color/ic_launcher_background" density="mdpi"
foreground="res/android/drawable/ic_launcher_foreground.xml" src="res/android/mipmap/mdpi/ic_launcher.webp"/>
[...]
```
But it does not work as it should. Android Studio does not generate `ldpi`. How to define it correctly?
GitHub link: https://github.com/apache/cordova/discussions/435
----
This is an automatically sent email for issues@cordova.apache.org.
To unsubscribe, please send an email to: issues-unsubscribe@cordova.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: issues-unsubscribe@cordova.apache.org
For additional commands, e-mail: issues-help@cordova.apache.org
[GitHub] [cordova] breautek added a comment to the discussion: Cordova-android how to correctly declare an adaptive icon
Posted by "breautek (via GitHub)" <gi...@apache.org>.
GitHub user breautek added a comment to the discussion: Cordova-android how to correctly declare an adaptive icon
If `ldpi` is the only one that doesn't work, it should be safe to omit that resource honestly. I do not think there is any device supported (that runs API 24) that is a low density resolution device.
I believe `anydpi` is used for vectors, since they can scale to any DPI.
If you have a source SVG vector, this is what I did.
1. Open/Create new android studio project (Can only access the Vector Asset Tool from within a project)
2. Via `Resource Manager`, Click on the `+` button
3. Select `Image Asset`, which will open a `Asset Studio` dialog where you can experiment with different settings and preview your icons.

4. Configure the settings to your preferences.
5. You'll likely need to rescale your SVG, even if your SVG follows the [recommended DP sizes](https://developer.android.com/develop/ui/views/launch/icon_design_adaptive#design-adaptive-icons). If your SVG uses the recommended, then a scale of ~62% seems to work good (judging based on 3 different apps that I've done this with).
The monochrome icon should follow the same thing as your foreground, except it should be binary colour (e.g. only white `#FFFFFF` and black (`#000000`). The colour that gets filled in depends on user settings and whether they are in dark mode or not.
GitHub link: https://github.com/apache/cordova/discussions/435#discussioncomment-7144327
----
This is an automatically sent email for issues@cordova.apache.org.
To unsubscribe, please send an email to: issues-unsubscribe@cordova.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: issues-unsubscribe@cordova.apache.org
For additional commands, e-mail: issues-help@cordova.apache.org
[GitHub] [cordova] kalwinskidawid added a comment to the discussion: Cordova-android how to correctly declare an adaptive icon
Posted by "kalwinskidawid (via GitHub)" <gi...@apache.org>.
GitHub user kalwinskidawid added a comment to the discussion: Cordova-android how to correctly declare an adaptive icon
After several hours of testing different ways and dozens of compilations I managed to define all the icons correctly (`WOOOOOOHO!`), if anyone would be interested I attach below how it should look like: .
So in config for android platform I did:
```xml
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
<application android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round"/>
</edit-config>
<!-- colors include <resources><color name ="ic_launcher_background">#FFFFFF</color></resources> -->
<resource-file src="res/android/colors.xml" target="/app/src/main/res/values/colors.xml" />
<!-- import drawable -->
<resource-file src="res/android/drawable/ic_launcher_foreground.xml" target="app/src/main/res/drawable/ic_launcher_foreground.xml" />
<!-- import anydpi -->
<resource-file src="res/android/mipmap/anydpi-v26/ic_launcher.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher.xml" />
<!-- import rounded icons -->
<resource-file src="res/android/mipmap/anydpi-v26/ic_launcher_round.xml" target="app/src/main/res/mipmap-anydpi-v26/ic_launcher_round.xml" />
<resource-file src="res/android/mipmap/hdpi/ic_launcher_round.webp" target="app/src/main/res/mipmap-hdpi/ic_launcher_round.webp" />
<resource-file src="res/android/mipmap/mdpi/ic_launcher_round.webp" target="app/src/main/res/mipmap-mdpi/ic_launcher_round.webp" />
<resource-file src="res/android/mipmap/xhdpi/ic_launcher_round.webp" target="app/src/main/res/mipmap-xhdpi/ic_launcher_round.webp" />
<resource-file src="res/android/mipmap/xxhdpi/ic_launcher_round.webp" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_round.webp" />
<resource-file src="res/android/mipmap/xxxhdpi/ic_launcher_round.webp" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.webp" />
<!-- create icons -->
<icon monochrome="res/android/drawable/ic_launcher_foreground.xml" background="@color/ic_launcher_background" density="mdpi"
foreground="res/android/drawable/ic_launcher_foreground.xml" src="res/android/mipmap/mdpi/ic_launcher.webp"/>
<icon monochrome="res/android/drawable/ic_launcher_foreground.xml" background="@color/ic_launcher_background" density="hdpi"
foreground="res/android/drawable/ic_launcher_foreground.xml" src="res/android/mipmap/hdpi/ic_launcher.webp"/>
<icon monochrome="res/android/drawable/ic_launcher_foreground.xml" background="@color/ic_launcher_background" density="xhdpi"
foreground="res/android/drawable/ic_launcher_foreground.xml" src ="res/android/mipmap/xhdpi/ic_launcher.webp" />
<icon monochrome="res/android/drawable/ic_launcher_foreground.xml" background="@color/ic_launcher_background" density="xxhdpi"
foreground="res/android/drawable/ic_launcher_foreground.xml" src ="res/android/mipmap/xxhdpi/ic_launcher.webp" />
<icon monochrome="res/android/drawable/ic_launcher_foreground.xml" background="@color/ic_launcher_background" density="xxxhdpi"
foreground="res/android/drawable/ic_launcher_foreground.xml" src ="res/android/mipmap/xxxhdpi/ic_launcher.webp" />
```
GitHub link: https://github.com/apache/cordova/discussions/435#discussioncomment-7144712
----
This is an automatically sent email for issues@cordova.apache.org.
To unsubscribe, please send an email to: issues-unsubscribe@cordova.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: issues-unsubscribe@cordova.apache.org
For additional commands, e-mail: issues-help@cordova.apache.org