uni-app 【分享】一个Notification 进度条插件(android,NJS实现,直接就可使用)
uni-app 【分享】一个Notification 进度条插件(android,NJS实现,直接就可使用)
如题,分享一个Notification 进度条插件(android,用js调用原生api实现,直接就可以使用).
参考1: http://ask.dcloud.net.cn/article/155
参考2:http://ask.dcloud.net.cn/question/2464
详细介绍: 最近有一个需求是,android更新资源包时,需要在通知栏里显示下载进度条,于是就搜索了下已有的解决方案
发现并没有现成的解决方案,于是参考了以上两个解决方案,结合了下,实现了直接能调用的js插件.
源码:
/**
* @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) {
return true;
} else if (numNow < numOld) {
return false;
}
}
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)
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);
this.mNotificationBuild.setOngoing(false);
this.mNotificationBuild.setContentTitle(defaultTitle);
this.mNotificationBuild.setContentText(defaultContent);
this.mNotificationBuild.setTicker(defaultTicker);
this.mNotificationBuild.setSmallIcon(17301620);
this.mNotificationBuild.setDefaults(Notification.DEFAULT_SOUND);
}
};
/**
* @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(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 || '进度提示';
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(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('测试标题','测试内容');
显示进度条代码:
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,同时显示不同的通知
示例源码:鉴于有一些朋友会有各式各样的奇怪错误,所以这里单独写了一个示例,测试了android机型(华为,联想)都是可以正常使用的.
示例源码中采用的是默认id
针对你分享的uni-app中Notification进度条插件(基于Android和NJS实现),以下是一个具体的代码案例,展示如何集成和使用该插件。假设插件已经封装好,并且可以通过NJS调用Android原生代码。
1. 插件集成
首先,确保你的uni-app项目已经正确配置了对Android平台的支持,并且你已经有了该Notification进度条插件的源码或已经通过某种方式引入了插件。
2. Android端代码(假设插件已经封装好)
这里假设插件的Java代码已经封装为一个服务(Service),并通过AIDL或某种方式暴露给NJS调用。以下是一个简化的示例:
// NotificationProgressService.java
public class NotificationProgressService extends Service {
private NotificationManager notificationManager;
private Notification.Builder notificationBuilder;
private int progress = 0;
@Override
public IBinder onBind(Intent intent) {
return binder;
}
public class LocalBinder extends Binder {
public NotificationProgressService getService() {
return NotificationProgressService.this;
}
}
private final IBinder binder = new LocalBinder();
public void updateProgress(int newProgress) {
progress = newProgress;
// 更新Notification的进度条
notificationBuilder.setProgress(100, progress, false);
notificationManager.notify(1, notificationBuilder.build());
}
// 其他必要的Service和Notification初始化代码...
}
3. uni-app端代码(使用NJS调用)
在uni-app中,你可以通过NJS调用Android原生方法。以下是一个简单的调用示例:
// 在需要显示进度条的地方调用
function showNotificationProgress() {
// 假设已经通过某种方式获取了service实例
const service = plus.android.runtimeMainActivity().getSystemService('your.package.name.NotificationProgressService');
// 模拟进度更新
let progress = 0;
const interval = setInterval(() => {
progress += 10;
if (progress > 100) {
clearInterval(interval);
}
// 调用Android原生方法更新进度
service.updateProgress(progress);
}, 1000);
}
// 调用函数显示进度条
showNotificationProgress();
注意事项
- 权限:确保在
manifest.json
中配置了必要的权限,如android.permission.FOREGROUND_SERVICE
。 - 服务绑定:上述代码示例中,
getSystemService
是一个假设的方法,你需要根据实际情况获取到NotificationProgressService
的实例。 - 错误处理:在实际应用中,应该添加错误处理逻辑,确保在调用原生方法时能够处理可能出现的异常。
这个示例展示了如何在uni-app中通过NJS调用Android原生代码来实现Notification进度条的功能。根据你的具体插件实现,可能需要对代码进行适当的调整。