1

誰かがこの問題で私を数日間悩ませてくれたことを本当に感謝します。ngCordova(cordova-plugin-badge)とphonegap-plugin-pushを実装しても、Androidのアプリアイコンのバッジは表示されません。

Iハイブリッドアプリは私は(PhoneGapの-プラグインプッシュを介して)にプッシュ通知を実装しているイオンのフレームワークを使用して作成しました。プッシュ通知は正常に動作しますが、私が欲しいのは、アプリケーションにバッジ数/番号を介して送信するためにプッシュ通知(すなわちGCMペイロード)のためであり、アプリケーションがそのカウント/数がかかりますし、アプリの横にバッジとしてそれを表示しますアイコン。私のコードは、バッジが既に作り付けあることを考えるとiOSデバイスのために完璧に動作しますが、私はAndroidプラットフォーム上で同じ考え(バッジ)を実装して困難を抱えています。

Androidプラットフォームに組み込まれていないバッジがあるため、一部のデバイスはサポートされていない可能性がありますが、少なくとも一部のデバイス(Samsung、Sonyなど)では動作するようにしたいと考えています。私が最も顕著に、多くの研究を行っている:

  1. コルドバ・プラグイン・バッジのiOSおよび特定のAndroidデバイスの両方で動作するようにをを想定しているドキュメントに記載されているが、それはしません(https://github.com/katzer/cordova-plugin-badge)すべてのAndroid搭載端末で動作します。 私がテストしているAndroidデバイスは、私がGoogle Playサービスをセットアップし、実際のデバイスのようにプッシュ通知と機能を受け取ることができるGenymotionのエミュレータです。これは問題になりますか?

  2. のみネイティブ Androidの実装のためのドキュメントを持っており、ハイブリッドAndroidアプリへのサポートを拡張するために前述したが、これはで私を助けることができなかったとして、おそらくコルドバ・プラグイン・バッジが利用するShortcutBadger(https://github.com/leolin310148/ShortcutBadger)すべて。

私の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 
      }); 
     } 
    }); 
}); 

はまた、アプリのアイコンウィジェットに変換する必要があるという問題ですバッジが機能するには?私はコルドバ・プラグイン・バッジがどのように実装されるかわからないとの指示は、Androidのために必要されているウィジェットについては何も言いませんでした。

はありがとうと任意のヘルプ/ヒントは大歓迎です:)私は日のためにこれをトラブルシューティングしていると、それはかなりイライラ。

答えて

3

証券のAndroidは、標準のランチャーの瞬間に、この機能を提供していません。

特定のメーカー(たとえば、サムスン)は、カスタマイズされたAndroidランチャーにこの機能を組み込んでいます。また、一部の第三者ランチャー(例:Nova Launcher)には、これを達成するためのAPIが含まれています。

あなたはさらに、について説明のために、次のリンクをチェックすることもできます。

  1. How does Facebook add badge numbers on app icon in Android?
  2. Does Samsung modifies it's Android ROMs to have badges on email and SMS icons?
  3. How to make application badge on android?

よろしく

+1

感謝、感謝! :) –

+0

@SYTan私に教えてください...あなたはこの問題を解決しましたか?あなたがそれを有効にするために適用したソリューション。私は最後の数日からこれに固執しています。 –

+0

@ Anjana-Systematix遅く返事を申し訳ありません。この投稿を閲覧しているすべての人の利益のために、これは私がしたものです。カスタマイズされたサードパーティのランチャー(つまりNova Launcher)を使用するだけでなく、Androidのバッジアイコンの公式なサポートがないため、(携帯電話の)通知バーに表示されるAndroid携帯のプッシュ通知で解決する必要がありました。これは、アンドロイドユーザーが、アプリアイコンのバッジとして表示される代わりに、通知バーに通知が表示されることに慣れていることを前提としています。 –

関連する問題