如何在 Ionic 移动应用程序中为 $cordova 本地通知的本地图像设置图标？答案

【问题标题】：How to set icon from local image for $cordovaLocalNotification in Ionic mobile application?如何在 Ionic 移动应用程序中为 $cordova 本地通知的本地图像设置图标？
【发布时间】：2023-04-03 18:43:01
【问题描述】：

我正在使用 Ionic 框架开发移动应用程序，目前正在尝试配置本地通知。我正在使用 ngCordova 和 local-notification plugin。

通知当前正在工作，但我似乎无法弄清楚如何从本地文件设置图标。我的图像当前位于路径“www/img/image.png”的离子项目存储库中。我正在尝试使用以下代码安排通知：

  var alarmTime = new Date();
      alarmTime.setMinutes(alarmTime.getMinutes() + 15);

    $cordovaLocalNotification.schedule({
      id: Math.random().toString(),
      date: alarmTime,
      message: 'Timeout Warning',
      title: 'Return to prevent your session from expiring.',
      autoCancel: false,
      icon: 'img/image.png'
    }, $scope);

通知有效，但没有出现所需的图标。在图标选项中，我还尝试了“www/img/image.png”以及“file://img/image.png”。每次，我总是看到默认的科尔多瓦机器人图标，而不是我尝试指定的图标。

有人对如何正确设置图标选项有任何提示吗？文档给出了使用外部图像的示例，但是是否可以使用本地图像？

【问题讨论】：

标签： cordova ionic-framework ionic localnotification ngcordova

【解决方案1】：

$cordovaLocalNotification.schedule({
  id: Math.random().toString(),
  date: alarmTime,
  message: 'Timeout Warning',
  title: 'Return to prevent your session from expiring.',
  autoCancel: false,
  icon: 'someimage'
}, $scope);

上例中的图标名称指向位置：/platforms/android/res/drawable/ 要使插件使用图标，图像文件必须位于此路径中，并按照参数中定义的名称命名。在这种情况下，它们是：

/platforms/android/res/drawable/someimage.png

在这里找到解决方案： ngCordova + local notification plugin

另外，查看 github 上的插件文档： https://github.com/katzer/cordova-plugin-local-notifications

您似乎应该使用公共 url 中的图标，尝试将您的图标上传到公共可访问的 url（驱动器、drobpox、tinypng ..）。

【讨论】：

不幸的是，本地路径仍然不起作用。将尝试将其发布到公共可访问的 url。
@Blake 您是否尝试从 url 设置图标？对你有用吗？
@Vandervidi 不，我仍然无法设置自定义图标图像。
我有一些问题，任何解决方案！请:(
您查看过 ngCordova 文档吗？ github.com/katzer/cordova-plugin-local-notifications（我已经编辑了答案）

【解决方案2】：

要使用本地文件，请使用路径作为 file://

您可以使用 www 文件夹中的任何文件作为 /assets/www/，例如将图像放入 www/img 中的文件夹，路径需要设置为 file://assets/ www/img/your_file.png

将您的图标应用程序设置为通知使用 file://res/drawable-ldpi-v4/icon.png 示例：

      $cordovaLocalNotification.schedule({
            id: message.number,
            date: d,
            message: message['message'],
            title: message['name'],
            //ongoing: true //not cleared messages
            sound: null,
            icon: 'file://res/drawable-ldpi-v4/icon.png'
            //OR file://assets/www/img/your_file.png
        })

【讨论】：

【解决方案3】：

 $scope.scheduleSingleNotification = function () {
        $cordovaLocalNotification.schedule({
          id: 1,
          title: 'GRM APP Builder',
          text: 'Quer café?!?',
          badge: 1,
          icon: 'res://coffee.png',
          data: {
            customProperty: 'custom value 1'
          }
        }).then(function (result) {
          console.log('Notification 1 triggered');
        });
      };

在这个问题花了几个小时后，我看到上面的一条评论真的是对的。

如果要更改图标，需要在“[my ionic app folder]\platforms\android\res\drawable”中创建一个名为“drawable”的文件夹。

但诀窍是：在此之后，您需要退出 livereload 模式并再次执行 CLI 命令“ionic run android -l -c -s”。这是必要的，因为您需要将新资产复制到设备。

我只在 Android 设备上测试过，如果你可以在 iOS 上测试，请在此处发送评论。

【讨论】：