android - ionic - 更改本地通知插件中的图标的正确方法是什么？

Question

我正在尝试使用 native local notifications plugin并且在更改通知的默认图标时遇到问题。

到目前为止，我已经使用两部手机来测试这一点，都是 Android 设备:第一部是 Oreo (8.1.0)，另一部是 Nougat (7.0)。我使用的是 Ionic CLI 4.5.0，并且我知道它的包装器与插件不兼容，如插件存储库中所述。

我已经根据 this answer 尝试了许多图标 URI 路径。建议，但似乎没有任何效果。

在提供程序中，这是代码的相关部分:

declare var cordova: any;
...
// inside a function that takes "id", "nome" and "tempo" as parameters:
cordova.plugins.notification.local.schedule({
    id: id,
    title: nome,
    text: "Sua atividade agendada, \"" + nome + "\", está prestes a começar!",
    at: new Date(tempo),
    foreground: true,
    icon: 'res://icone-notif.png',
    smallIcon: 'res://icone-notif-24.png'
});

在我的 config.xml 中，我添加了这些行:

<platform name="android">
    ...
    <resource-file src="resources/android/icon/icone-notif-24.png" target="res/icone-notif-24.png" />
    <resource-file src="resources/android/icon/icone-notif.png" target="res/icone-notif.png" />
</platform>

(我已经检查了每个文件，它们已正确放置在我的项目中的“res”文件夹中)

通知图标应该显示为我保存在这些文件夹中的图像，但我得到的只是默认的白色方 block 。

Answer 1

我苦苦挣扎了很长时间，以下是我为解决这个问题所做的事情:

我的通知声明如下:

const notification = {
    id: idNotif,
    text: this.getNotifText(notifs[0].type),
    trigger: {at: dateNotif},
    led: 'FF0000',
    smallIcon: 'res://ic_stat_notify.png',
    icon: 'res://icon.png',
    vibrate: true
};
this.localNotifications.schedule(notification);

在该代码示例中，请注意这些图标的链接以 res:// 为前缀。这些图标实际上位于 platforms/android/app/src/main/res 文件夹中，该文件夹是在编译应用程序时自动生成的(使用 ionic cordova run android for实例)。

如果您希望通知正常工作，您应该在该 res 文件夹中包含以下文件夹:

• drawable-mdpi
• drawable-hdpi
• 可绘制-xhdpi
• 可绘制-xxhdpi
• drawable-xxxhdpi

您还需要直接在文件夹 res 中使用文件 icon.png，因为它在本地通知中被引用为 icon 参数声明。

这些文件夹对应于Android 中可能的不同图标尺寸，具体取决于像素密度。您可以在icon handbook中找到更多相关信息。 。当通知被触发时，将自动从这 5 种可能的尺寸中选择合适的图标尺寸。

每个文件夹都必须包含文件 ic_stat_notify.png，该文件必须是正确格式的图标:

• 可绘制 mdpi:24x24
• 可绘制 hdpi:36x36
• 可绘制xhdpi:48x48
• 可绘制-xxhdpi:72x72
• drawable-xxxhdpi:96x96
• 图标.png:96x96

好的，但是如何将它们放在编译后生成的文件夹中？

答案是:通过创建钩子(Hook)。

将这些文件夹放在您可以访问且始终存在于您的应用中的文件夹中。就我个人而言，我使用了resources/android/icon。

然后，创建一个 Hook ，以便在每次编译应用程序时将这些文件复制到正确的文件夹中。

这是我的钩子(Hook)icon_notif.js(注意:它很大程度上受到this tutorial的启发):

#!/usr/bin/env node

var filestocopy = [];
var filestocopyAndroid = [
    {
        "resources/android/icon/drawable-mdpi/ic_stat_notify.png":
        "platforms/android/app/src/main/res/drawable-mdpi/ic_stat_notify.png"
    },
    {
        "resources/android/icon/drawable-hdpi/ic_stat_notify.png":
        "platforms/android/app/src/main/res/drawable-hdpi/ic_stat_notify.png"
    },
    {
        "resources/android/icon/drawable-xhdpi/ic_stat_notify.png":
        "platforms/android/app/src/main/res/drawable-xhdpi/ic_stat_notify.png"
    },
    {
        "resources/android/icon/drawable-xxhdpi/ic_stat_notify.png":
        "platforms/android/app/src/main/res/drawable-xxhdpi/ic_stat_notify.png"
    },
    {
        "resources/android/icon/drawable-xxxhdpi/ic_stat_notify.png":
        "platforms/android/app/src/main/res/drawable-xxxhdpi/ic_stat_notify.png"
    },
    {
        "resources/android/icon/icon.png":
        "platforms/android/app/src/main/res/icon.png"
    }
];

var fs = require('fs');
var path = require('path');
var rootdir = './';
var androiddir = path.join(rootdir, "platforms/android");
var iosdir = path.join(rootdir, "platforms/ios");

if(fs.existsSync(androiddir)) {
    filestocopy = filestocopyAndroid;
    console.log("Android platform file recognized");
} else if(fs.existsSync(iosdir)) {
    console.log("iOS platform file recognized");
    filestocopy = filestocopyiOS;
} else {
    console.log("Error: no Android or iOS platform file was recognized.");
    filestocopy = [];
}

console.log("~~~~ Start Copying Notification Status Icons");
filestocopy.forEach(function (obj) {
    Object.keys(obj).forEach(function (key) {
        var val = obj[key];
        var srcfile = path.join(rootdir, key);
        var destfile = path.join(rootdir, val);
        console.log("copying: " + srcfile);
        console.log("     to: " + destfile);
        var destdir = path.dirname(destfile);
        if(!fs.existsSync(destdir)) {
            fs.mkdirSync(destdir);
        }
        if (fs.existsSync(srcfile) && fs.existsSync(destdir)) {
            fs.createReadStream(srcfile).pipe(
                fs.createWriteStream(destfile));
        }
    });
});
console.log("~~~~ End Copying Notification Status Icons");

基本上，此脚本将正确的文件夹复制到新生成的platforms/android/app/src/main/res 文件夹中。

只要这个钩子(Hook)正常运行，一切都应该正常工作!