SAMPLE APP 👉

Cordova plugin to access and modify the badge number of the app icon on various mobile platforms including iOS, Android and Windows.

Users see notifications in the following ways:

• Badging the app’s icon
• Progress indicator (OSX based on https://github.com/hokein/DockProgressBar)

• Android / Amazon FireOS (via ShortcutBadger)
• Browser (via favico.js)
• iOS 10+
• OSX
• Windows (Phone and Desktop)

The plugin can be installed via Cordova-CLI and is publicly available on NPM.

Execute from the projects root folder:

$ cordova plugin add cordova-plugin-badge

Or install a specific version:

$ cordova plugin add cordova-plugin-badge@VERSION

Or install the latest head version:

$ cordova plugin add https://github.com/katzer/cordova-plugin-badge.git

Or install from local source:

$ cordova plugin add <path> --nofetch --nosave

The plugin creates the object cordova.plugins.notification.badge and is accessible after deviceready has been fired.

document.addEventListener('deviceready', function () {
    // cordova.plugins.notification.badge is now available
}, false);

Badge numbers cannot be negative. The maximum might be restricted by the OS. A callback is optional and will be invoked with the current badge number.

cordova.plugins.notification.badge.set(10);

There's built-in support to increase the badge number:

cordova.plugins.notification.badge.increase(1, function (badge) {
    // badge is now 11 (10 + 1)
});

To decrease the badge number:

cordova.plugins.notification.badge.decrease(2, function (badge) {
    // badge is now 9 (11 - 2)
});

And to clear out the badge number:

cordova.plugins.notification.badge.clear();

The default value is 0. The badge number wont get lost after reboot or app restart.

cordova.plugins.notification.badge.get(function (badge) {
    ...
});

Note: Modifying the badge number outside of the plugin does result into wrong behaivor!

To clear the badge number automatically if the user taps the app icon:

cordova.plugins.notification.badge.configure({ autoClear: true });

OSX supports additional indicators. Other than to badge these are circular and download.

cordova.plugins.notification.badge.configure({ indicator: 'circular' });

The plugin might ask for granting permissions to modify the badge number. That's done automatically but it's also possible to request them manually:

cordova.plugins.notification.badge.requestPermission(function (granted) {
    ...
});

To check if they have been granted already:

cordova.plugins.notification.badge.hasPermission(function (granted) {
    ...
});

On Android not all launchers support badges. In order to set badges the plugin uses ShortcutBadger. Check out their website to see which launchers are supported.

If you're using PhoneGap Build please make sure you specify gradle as your Android build tool in config.xml:

<preference name="android-build-tool" value="gradle" />

To specify a custom version of ShortcutBadger follow this guide. The name of the property is appShortcutBadgerVersion.

# In <your-project>/platforms/android/gradle.properties
appShortcutBadgerVersion=1.1.22

1. Fork it
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create new Pull Request

This software is released under the Apache 2.0 License.

Made with 😋 from Leipzig

© 2013 appPlant GmbH