Cordova - Android上的自适应图标

EDJ*_*EDJ 11 icons android fill cordova

我使用Android Image Asset Studio生成了一组图标.但是,我不知道如何将这些图标设置到我的应用程序中Cordova.

在遵循Cordova中有关图标文档时,我只设法使用以下代码将方形图标设置为我的项目:

<platform name="android">
    <!--
        ldpi    : 36x36 px
        mdpi    : 48x48 px
        hdpi    : 72x72 px
        xhdpi   : 96x96 px
        xxhdpi  : 144x144 px
        xxxhdpi : 192x192 px
    -->
    <icon src="res/android/ldpi.png" density="ldpi" />
    <icon src="res/android/mdpi.png" density="mdpi" />
    <icon src="res/android/hdpi.png" density="hdpi" />
    <icon src="res/android/xhdpi.png" density="xhdpi" />
    <icon src="res/android/xxhdpi.png" density="xxhdpi" />
    <icon src="res/android/xxxhdpi.png" density="xxxhdpi" />
</platform>
Run Code Online (Sandbox Code Playgroud)

但是,在Android Oreo中,应用程序的图标是圆形的,它不能在该手机上正确显示我的应用程序图标.图标在圆圈内缩小,周围有白色背景.

在此输入图像描述

问题:如何将Image Asset Studio生成的圆形图标设置为Cordova项目?

Vik*_*ngh 11

以下是我的生产项目的测试和工作解决方案

所有生成的图标复制到res/android你的项目的根(同一水平resourcesplatforms文件夹),并添加下面的配置config.xml文件:

<widget xmlns:android="http://schemas.android.com/apk/res/android">
    <platform name="android">
        <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>
        <resource-file src="res/android/drawable/ic_launcher_background.xml" target="app/src/main/res/drawable/ic_launcher_background.xml" />
        <resource-file src="res/android/mipmap-hdpi/ic_launcher.png" target="app/src/main/res/mipmap-hdpi/ic_launcher.png" />
        <resource-file src="res/android/mipmap-hdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-hdpi/ic_launcher_round.png" />
        <resource-file src="res/android/mipmap-mdpi/ic_launcher.png" target="app/src/main/res/mipmap-mdpi/ic_launcher.png" />
        <resource-file src="res/android/mipmap-mdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-mdpi/ic_launcher_round.png" />
        <resource-file src="res/android/mipmap-xhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher.png" />
        <resource-file src="res/android/mipmap-xhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xhdpi/ic_launcher_round.png" />
        <resource-file src="res/android/mipmap-xxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher.png" />
        <resource-file src="res/android/mipmap-xxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png" />
        <resource-file src="res/android/mipmap-xxxhdpi/ic_launcher.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher.png" />
        <resource-file src="res/android/mipmap-xxxhdpi/ic_launcher_round.png" target="app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png" />
    </platform>    
</widget>
Run Code Online (Sandbox Code Playgroud)

别忘了加入xmlns:android="http://schemas.android.com/apk/res/android"你的<widget>.

<icon>如果你有in <widget>> <platform=>,请删除<icon>

添加上述更改后config.xml,删除您的Android平台ionic cordova platform remove androidsudo ionic cordova platform remove android(取决于您的环境设置),然后再次添加Android平台ionic cordova platform add androidsudo ionic cordova platform add android.

创建构建,安装并检查结果.我在生产代码中使用了以上配置,结果如下:

在此输入图像描述

我希望这能帮到您!

  • @EDJ我已经更新了答案,这是一个有证据的工作解决方案.检查并告诉我. (2认同)