PhoneGap 3 plugin to show a loading spinner with optional dark overlay.
Add plugin to your project:
cordova plugin add https://github.com/mobimentum/phonegap-plugin-loading-spinner.git
Add the following to your config.xml to use version 1.0.0 of this plugin (recommended):
<gap:plugin name="it.mobimentum.phonegapspinnerplugin" />
You can also omit the version tag to always use the most recent version of this plugin. Note that this will result in your app being automatically updated with new versions of this plugin as they are released, and may result in unexpected behaviour.
Show spinner with default arguments:
spinnerplugin.show();
Show spinner with optional arguments:
spinnerplugin.show({
overlay: false, // defaults to true
timeout: 30, // defaults to 0 (no timeout)
fullscreen: true, // defaults to false
});
Hide spinner:
spinnerplugin.hide();
I encourage you to use the following code to gracefully replace the default jQM loader:
onDeviceReady: function() {
// Native loading spinner
if (window.spinnerplugin) {
$.extend($.mobile, {
loading: function() {
// Show/hide spinner
var arg = arguments ? arguments[0] : '';
if (arg == 'show') spinnerplugin.show({'overlay':true});
else if (arg == 'hide') spinnerplugin.hide();
// Compatibility with jQM 1.4
return { loader: function() { } }
}
});
}
}
Thus, if the SpinnerPlugin is added and working the native spinner would be used, otherwise the standard jQM loader is fired.