Значок на значке приложения для Android не отображается даже после реализации ngCordova (cordova-plugin-badge) и phonegap-plugin-push

Я буду очень признателен, если кто-нибудь может помочь мне с этой проблемой, которая беспокоила меня в течение нескольких дней.

У меня есть гибридное приложение, созданное с использованием фреймворка Ionic, в котором я реализовал push-уведомления (через phonegap-plugin-push). Push-уведомления работают нормально, но я хочу, чтобы push-уведомление (т.е. полезная нагрузка GCM) отправляло счетчик/номер значка в приложение, и приложение примет этот счет/число и отобразит его в виде значка рядом с приложением. значок. Мой код отлично работает для устройств iOS, учитывая, что значки уже встроены, но у меня возникли трудности с реализацией той же идеи (значков) на платформе Android.

Я знаю, что из-за того, что значки не встроены в платформу Android, некоторые устройства могут не поддерживаться, но, по крайней мере, я хочу, чтобы это работало на некоторых устройствах (например, Samsung, Sony). Я провел много исследований, наиболее заметные из которых:

  1. Cordova-plugin-badge (https://github.com/katzer/cordova-plugin-badge), который, как указано в документации, должен работать как на iOS, так и на некоторых устройствах Android, но для меня он вообще не работает ни на одном устройстве Android. Обратите внимание, что устройства Android, на которых я тестировал, являются эмуляторами от Genymotion, на которых я настроил сервисы Google Play и могу получать push-уведомления и функционировать почти как настоящее устройство. Будет ли это проблемой?

  2. ShortcutBadger (https://github.com/leolin310148/ShortcutBadger), в котором есть документация только для нативного Реализация Android и предположительно используется Cordova-plugin-badge, как указано выше, для расширения поддержки гибридных приложений Android, но мне это никак не помогло.

Мой index.html:

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="css/style.css" rel="stylesheet">

    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/ionic-platform-web-client/dist/ionic.io.bundle.min.js"></script>

    <script src="js/ng-cordova.js"></script>
    <script src="cordova.js"></script>

    <script src="js/app.js"></script>

  </head>
  <body ng-app="starter">
    <ion-pane>
      <ion-header-bar class="bar-stable">
        <h1 class="title">Trade Deals</h1>
      </ion-header-bar>
      <ion-content ng-controller="badgeController">
        <div>Number of deals pending now: </div>
        <div class="deals"></div>
        <button class="button" ng-click="setBadge(10)">Set badge 10</button>
        <button class="button" ng-click="hasPermission()">Show permission</button>
        <button class="button" ng-click="get()">Get badge count</button>
        <button class="button" ng-click="clear()">Clear badge count</button>
        <button class="button" ng-click="increase()">Increase by 1</button>
        <button class="button" ng-click="decrease()">Decrease by 1</button>
      </ion-content>
    </ion-pane>
  </body>
</html>

Мой app.js:

angular.module('starter', ['ionic', 'ngCordova'])

/*
 * do a ionic.push register() every time the app launches for the first time
 * so that it is guaranteed that there is always a valid device token for GCM/APNS
 */
.run(function($ionicPlatform, $cordovaBadge) {
  $ionicPlatform.ready(function() {
    console.log("Device platform is "+device.platform);
    var push = new Ionic.Push({
      "debug": true,
      "onNotification": function(notification) {
        console.log("notification received!!!");
        var payload = notification.payload;
        var payloadStr = JSON.stringify(payload, null, 4);
        var notiStr = JSON.stringify(notification, null, 4);
        console.log("notification: "+notiStr);

        var countIndex = notiStr.indexOf("count");  // extracting badge count from the GCM payload
        var badgeIndex = countIndex + 9;
        var badgeNo;
        if (!isNaN(notiStr[badgeIndex+1])) {
          badgeNo = notiStr.substr(badgeIndex,badgeIndex+2);
        }
        else {
          badgeNo = notiStr[badgeIndex];
        }

        if (device.platform == "Android") {
          $cordovaBadge.set(badgeNo);
        }
      },
      "onRegister": function(data) {
        console.log(data.token);
      },
      "pluginConfig": {
        "android": {
          "sound": "true",
          "badge": "true",
          "icon": "icon",
          "iconColor": "lime"
        },
        "ios": {
          "alert": "true",
          "badge": "true",
          "sound": "true"
        },
      }
    });

    push.register(function(token) {
      console.log("My Device token:",token.token);
      //window.alert("The token is "+token.token);
      push.saveToken(token);  // persist the token in the Ionic Platform so that it doesn't change on multiple launches
    });

    $cordovaBadge.get().then(function(badge) {
      document.querySelector(".deals").innerHTML = badge;
    });
  });
})

.controller("badgeController", function($scope, $ionicPlatform, $cordovaBadge) {
    console.log("inside badgeController");

    $ionicPlatform.ready(function() {
        $ionicPlatform.on('resume', function() {
          $cordovaBadge.get().then(function(badge) {
            document.querySelector(".deals").innerHTML = badge;
          });
        });
        //$cordovaBadge.configure({autoClear: true});  // configure to clear all notifications whenever user opens the app
        $scope.setBadge = function(value) {
          console.log("inside setBadge");
          $cordovaBadge.hasPermission().then(function(result) {
              $cordovaBadge.set(value);
              window.alert("Badge count is "+value);
          }, function(error) {
              console.log(JSON.stringify(error));   // display error message
          });
        }

        $scope.hasPermission = function() {
          console.log("inside hasPermission");
          $cordovaBadge.hasPermission().then(function(result) {
              window.alert("User has permission: "+result);
              console.log("device has permission");
          }, function(error) {
              console.log(JSON.stringify(error));   // display error message
          });
        }

        $scope.get = function() {
          console.log("inside get");
          $cordovaBadge.hasPermission().then(function(result) {
              $cordovaBadge.get().then(function(badge) {
                if (badge>=0) {
                  document.querySelector(".deals").innerHTML = badge;
                }
              })
          }, function(error) {
              console.log(JSON.stringify(error));   // display error message
          });
        }

        $scope.clear = function() {
          console.log("inside clear");
          $cordovaBadge.hasPermission().then(function(result) {
              $cordovaBadge.clear();
              window.alert("Cleared badge count");
          }, function(error) {
              console.log(JSON.stringify(error));   // display error message
          });
        }

        $scope.increase = function() {
          console.log("inside increase");
          $cordovaBadge.hasPermission().then(function(result) {
              $cordovaBadge.increase();
              window.alert("Increased badge count");
          }, function(error) {
              console.log(JSON.stringify(error));   // display error message
          });
        }

        $scope.decrease = function() {
          console.log("inside decrease");
          $cordovaBadge.hasPermission().then(function(result) {
              $cordovaBadge.decrease();
              window.alert("Good job!");
              //window.alert("Decreased badge count");
          }, function(error) {
              console.log(JSON.stringify(error));   // display error message
          });
        }
    });
});

Кроме того, проблема заключается в том, что значок приложения должен быть преобразован в виджет, чтобы значки работали? Я не уверен, как реализован значок Cordova-Plugin-Badge, и в инструкциях ничего не сказано о виджетах, необходимых для Android.

Спасибо, и любая помощь / советы приветствуются :) Я устранял эту проблему в течение нескольких дней, и это довольно неприятно.


person SY Tan    schedule 14.06.2016    source источник


Ответы (1)


Стандартный Android на данный момент не предлагает эту функцию в стандартном лаунчере.

Некоторые производители (в частности, Samsung) включили эту функцию в свои настраиваемые программы запуска Android. Также некоторые сторонние лаунчеры (например, Nova Launcher) имеют для этого API.

Вы можете проверить следующие ссылки для дальнейшего объяснения:

  1. Как Facebook добавляет номера значков на значке приложения в Android?
  2. Изменяет ли Samsung ПЗУ Android, чтобы на значках электронной почты и SMS отображались значки?
  3. Как сделать значок приложения на Android?

С Уважением

person Hardik Vaghani    schedule 22.06.2016
comment
@SYTan, пожалуйста, дайте мне знать ... вы решили эту проблему? какое решение вы применили, чтобы заставить его работать. Я застрял в этом с последних нескольких дней. - person Anjana; 16.08.2016
comment
@ Anjana-Systematix извините за поздний ответ. Для пользы всех, кто посещает этот пост, я сделал это. Мне пришлось прибегнуть к настройке push-уведомлений для телефонов Android, чтобы они отображались только в (скользящих вниз) панелях уведомлений, поскольку на Android пока нет официальной поддержки значков значков, кроме использования сторонних пусковых установок (например, Nova Launcher). Это делается с учетом того, что пользователи Android привыкли к тому, что их уведомления отображаются на панели уведомлений вместо того, чтобы количество значков отображалось в виде значка на значке приложения. - person SY Tan; 26.02.2017