一个Notification 进度条插件(android,NJS实现,直接就可使用)

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了一个Notification 进度条插件(android,NJS实现,直接就可使用)相关的知识,希望对你有一定的参考价值。

参考文章:http://ask.dcloud.net.cn/article/503

源码地址下载

如题,分享一个Notification 进度条插件(android,用js调用原生api实现,直接就可以使用).
参考1: http://ask.dcloud.net.cn/article/155
参考2:http://ask.dcloud.net.cn/question/2464

详细介绍: 最近有一个需求是,android更新资源包时,需要在通知栏里显示下载进度条,于是就搜索了下已有的解决方案
发现并没有现成的解决方案,于是参考了以上两个解决方案,结合了下,实现了直接能调用的js插件.

第一步(分析以上两种方案的缺陷):
第一种:功能上能实现需求,但是使用起来太麻烦,而且也不方便调试(需要离线打包后才能看到效果),
而且,我这里还遇到了一个问题,在 hbuild 6.9.2 中,我明明已经添加了自定义模块权限,但是却一直提示我 ***权限没有添加, 真的是把我弄的吐血了, 所以没办法,只能另谋他路.

第二种:使用起来很方便,但是却没有完全达到功能要求(只显示了普通通知,但没有显示进度条),而且在api <16 的机子上会报错.
于是在这个基础上,结合第一种方法.写了一个 工具类,实现android的通知栏控制(兼容了api11-16的通知显示)

源码:

/**
 * @description njs实现android原生功能 
 * 1.通知栏消息
 * @see http://ask.dcloud.net.cn/article/503
 * 
 * @author dailc
 * @version 1.0
 * @time 2016-01-08 08:38:20
 */
(function(obj) {
    var defaultTitle = \'通知栏标题\';
    var defaultContent = \'通知内容\';
    var defaultTicker = \'通知提示\';
    var defaultNotifyId = 1000;
    var defaultNumber = 1;
    /**
     * plusReady
     * @param {type} callback
     * @returns {Window}
     */
    obj.plusReady = function(callback) {
        if (window.plus) {
            setTimeout(function() { //解决callback与plusready事件的执行时机问题(典型案例:showWaiting,closeWaiting)
                callback();
            }, 0);
        } else {
            document.addEventListener("plusready", function() {
                callback();
            }, false);
        }
        return this;
    };
    /**
     * @description 比较两个版本大小
     * 比较版本大小,如果新版本nowVersion大于旧版本OldResourceVersion则返回true,否则返回false
     */
    function compareVersion(OldVersion, nowVersion) {
        if (!OldVersion || !nowVersion || OldVersion == \'\' || nowVersion == \'\') {

            return false;
        }
        //第二份参数 是 数组的最大长度
        var OldVersionA = OldVersion.split(".", 4);
        var nowVersionA = nowVersion.split(".", 4);
        for (var i = 0; i < OldVersionA.length && i < nowVersionA.length; i++) {
            var strOld = OldVersionA[i];
            var numOld = parseInt(strOld);
            var strNow = nowVersionA[i];
            var numNow = parseInt(strNow);
            //小版本到高版本
            if (numNow > numOld
                //||strNow.length>strOld.length
            ) {
                return true;
            } else if (numNow < numOld) {
                return false;
            }
        }
        //如果是版本  如 1.6 - 1.6.1
        if (nowVersionA.length > OldVersionA.length && 0 == nowVersion.indexOf(OldVersion)) {
            return true;
        }
    };
    /**
     * @description 通过push功能来推送消息
     */
    obj.sendNotificationByPush = function() {
        var options = {
            cover: false
        };
        var str = ": 欢迎使用html5 Plus创建本地消息!";
        plus.push.createMessage(str, "LocalMSG", options);
    };
    (function() {
        /**
         * @constructor 创建通知栏进度条构造函数
         */
        function NotificationCustom() {
            if (plus.os.name != \'Android\') {
                return;
            }
            //当前版本号
            var SystemVersion = plus.os.version;
            var Context = plus.android.importClass("android.content.Context");
            var main = plus.android.runtimeMainActivity();
            var NotificationManager = plus.android.importClass("android.app.NotificationManager");
            var nm = main.getSystemService(Context.NOTIFICATION_SERVICE)
                // Notification build 要android api16以上才能使用(4.1.2以上)
            var Notification = null;
            if (compareVersion(\'4.1.1\', SystemVersion) == true) {
                Notification = plus.android.importClass("android.app.Notification");
            } else {
                Notification = plus.android.importClass("android.support.v4.app.NotificationCompat");
            }
            if (Notification) {
                this.notifyManager = nm;
                this.mNotificationBuild = new Notification.Builder(main);
                //设为true代表常驻状态栏
                this.mNotificationBuild.setOngoing(false);
                this.mNotificationBuild.setContentTitle(defaultTitle);
                this.mNotificationBuild.setContentText(defaultContent);
                this.mNotificationBuild.setTicker(defaultTicker);
                //默认的push图标
                this.mNotificationBuild.setSmallIcon(17301620);
                //设置默认声音
                //console.log(\'默认:\'+plus.android.importClass("android.app.Notification").DEFAULT_SOUND);
                this.mNotificationBuild.setDefaults(plus.android.importClass("android.app.Notification").DEFAULT_SOUND);
                //this.mNotificationBuild.setNumber(defaultNumber)
            }
        };
        /**
         * @description 给android通知栏发送通知
         * @param {String} title 标题
         * @param {String} content  内容
         * @param {String} tickerTips  提示
         * @param {Number} notifyId id,默认为1000
         */
        NotificationCustom.prototype.setNotification = function(title, content, tickerTips,notifyId) {
            if (this.mNotificationBuild == null ||
                this.notifyManager == null) {
                return;
            }
            notifyId = (typeof(notifyId)==\'number\')?notifyId:defaultNotifyId;
            title = title || defaultTitle;
            content = content || defaultContent;
            tickerTips = tickerTips || defaultTicker;
            this.mNotificationBuild.setContentTitle(title);
            this.mNotificationBuild.setContentText(content);
            this.mNotificationBuild.setTicker(tickerTips);
            //默认有声音
            this.mNotificationBuild.setDefaults(plus.android.importClass("android.app.Notification").DEFAULT_SOUND);
            this.notifyManager.notify(notifyId, this.mNotificationBuild.build());
        };
        /**
         * @description 设置进度条
         * @param {Number} progress
         * @param {String} title 标题
         * @param {String} content  内容
         * @param {String} tickerTips  提示
         * @param {Number} notifyId id,默认为1000
         */
        NotificationCustom.prototype.setProgress = function(progress, title, content, tickerTips,notifyId) {
            if (this.mNotificationBuild == null ||
                this.notifyManager == null) {
                return;
            }
            notifyId = (typeof(notifyId)==\'number\')?notifyId:defaultNotifyId;
            title = title || \'正在下载\';
            content = content || \'正在下载\';
            tickerTips = tickerTips || \'进度提示\';
            //          tickerTips = tickerTips || defaultTicker;
            this.mNotificationBuild.setContentTitle(title);
            this.mNotificationBuild.setContentText(content);
            this.mNotificationBuild.setTicker(tickerTips);
            //进度条显示时,默认无声音
            this.mNotificationBuild.setDefaults(0);
            this.mNotificationBuild.setProgress(100, progress, false);
            this.notifyManager.notify(notifyId, this.mNotificationBuild.build());
        };
        /**
         * @description 完成进度条
         * @param {String} title 标题
         * @param {String} content  内容
         * @param {String} tickerTips  提示
         * @param {Number} notifyId id,默认为1000
         */
        NotificationCustom.prototype.compProgressNotification = function(title, content, tickerTips,notifyId) {
            if (this.mNotificationBuild == null ||
                this.notifyManager == null) {
                return;
            }
            notifyId = (typeof(notifyId)==\'number\')?notifyId:defaultNotifyId;
            title = title || \'进度条显示完毕\';
            content = content || \'进度条显示完毕\';
            tickerTips = tickerTips || \'进度提示\';
            this.mNotificationBuild.setContentTitle(title);
            this.mNotificationBuild.setContentText(content);
            this.mNotificationBuild.setTicker(tickerTips);
            this.mNotificationBuild.setProgress(0, 0, false);
            //默认有声音
            this.mNotificationBuild.setDefaults(plus.android.importClass("android.app.Notification").DEFAULT_SOUND);
            this.notifyManager.notify(notifyId, this.mNotificationBuild.build());
        };
        /**
         * @description 清除通知栏信息
         * @param {Number} notifyId id,默认为1000
         */
        NotificationCustom.prototype.clearNotification = function(notifyId) {
            notifyId = (typeof(notifyId)==\'number\')?notifyId:defaultNotifyId;
            if(this.notifyManager){
                this.notifyManager.cancel(notifyId);
            }       
        };
        /**
         * @description 清除所有通知栏信息
         */
        NotificationCustom.prototype.clearAllNotification = function() {
            if(this.notifyManager){
                this.notifyManager.cancelAll();
            }       
        };
        obj.plusReady(function() {
            obj.NotificationUtil = new NotificationCustom();
        });
    })();

})(window.NjsPhoneApi = {});

调用方法示例:
显示普通通知:

NjsPhoneApi.NotificationUtil.setNotification(\'测试标题\'+staticI,\'测试内容\');

显示进度条代码:

function testProgress() {
        //插件调用
        NjsPhoneApi.NotificationUtil.setNotification("新版下载", "开始下载");
        var current = 0;
        NjsPhoneApi.NotificationUtil.setProgress(current); //插件调用
        function progress() {
            setTimeout(function() {
                current += 1;
                NjsPhoneApi.NotificationUtil.setProgress(current);
                if(current>=100){
                     NjsPhoneApi.NotificationUtil.compProgressNotification("下载完成");
                }else{
                    progress();
                }
            }, 100);
        };
        progress();
    };
testProgress();//调用显示进度条

取消单条通知:(传入参数为id,不传采用默认id)

NjsPhoneApi.NotificationUtil.clearNotification();

取消所有通知:

NjsPhoneApi.NotificationUtil.clearAllNotification();

另外: 支持自定义id的通知,也就是说可以通过传入不同的id,同时显示不同的通知

效果图1:
效果图2:
示例源码:鉴于有一些朋友会有各式各样的奇怪错误,所以这里单独写了一个示例,测试了android机型(华为,联想)都是可以正常使用的.
示例源码中采用的是默认id

以上是关于一个Notification 进度条插件(android,NJS实现,直接就可使用)的主要内容,如果未能解决你的问题,请参考以下文章

Android中使用Notification实现进度通知栏(示例三)

如何在service中同步更新通知activity中的进度条

Android 检查更新版本(带有通知栏,进度条,Notification)

Android 检查更新版本(带有通知栏,进度条,Notification)

在科尔多瓦本地通知中显示进度条

在 ActionBar 上放一个进度条