我正在使用 Angular 4 创建一个应用程序,它应该不时收到推送通知。我设法使通知出现,但我无法自定义其样式和内容。
我正在寻找的是一种更改通知背景颜色的方法,以便我可以让它们闪烁以引起用户的注意。
这是我的代码:
public showNotification(title: string, text: string): Notification {
// Check if notifications are supported
const notificationOptions = {
body: `<div style="color:red"><p>${text}</p></div>`,
icon: 'assets/img/logo_onyo-simples.png',
badge: 'assets/img/logo_onyo-simples.png',
vibrate: [200, 100, 200]
};
try {
// Throws an exception if the browser doesn't support a notification.
const notification = new Notification(title, notificationOptions);
notification.onclick = (e: any) => {
window.focus();
notification.close();
};
return notification;
}
catch (e) {
if (e.name === 'TypeError') {
this.raven.captureBreadcrum({
message: 'This browser does not support notifications',
level: 'warning',
category: 'notification'
});
}
else {
this.raven.captureException(e);
throw e;
}
}
}
我尝试在通知正文中添加一个测试 HTML 标记,但这没有用。有没有办法做到这一点?
注意:我没有使用 Toastr 通知的原因是我希望即使浏览器最小化或在另一个应用程序后面,用户也能收到我的通知。
注 2:这是我正在使用的通知类型的示例:https : //tests.peter.sh/notification-generator/。
我相信您尝试做的事情是不可能的,至少根据规范。没有用于传递/设置视觉呈现的属性或方法。
我在这里推测,但这可能是因为浏览器供应商想要完全阻止您尝试创建的行为类型。也许你可以设计一个具有良好品味和设计的通知。然而,这也会为人们创造糟糕的、烦人的和直接的掠夺性通知打开大门。它将为黑暗模式打开大门。
虽然,将来可能会添加这种风格的灵活性。我只是不这么认为。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句