devbox
小丑西瓜9
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

【HarmonyOS】消息通知场景的实现_notificationmanager推鸿蒙

作者：小丑西瓜9 | 2024-04-01 21:34:41

赞

踩

notificationmanager推鸿蒙

            从今天开始，博主将开设一门新的专栏用来讲解市面上比较热门的技术 “鸿蒙开发”，对于刚接触这项技术的小伙伴在学习鸿蒙开发之前，有必要先了解一下鸿蒙，从你的角度来讲，你认为什么是鸿蒙呢？它出现的意义又是什么？鸿蒙仅仅是一个手机操作系统吗？它的出现能够和Android和IOS三分天下吗？它未来的潜力能否制霸整个手机市场呢？

抱着这样的疑问和对鸿蒙开发的好奇，让我们开始今天对消息通知的掌握吧！

目录

基础通知

进度条通知

通知意图

基础通知

在harmonyos当中提供了各种不同功能的通知来满足我们不同的业务需求，接下来我们首先开始对基础通知它的场景和实现方式进行讲解。

应用可以通过通知接口发送通知消息，提醒用户关注应用中的变化，用户可以在通知栏查看和操作通知内容。以下是基础通知的操作步骤：

1）导入 notification 模块：

import notificationManager from '@ohos.notificationManager';

2）发布通知：

  1. // 构建通知请求
  2. let request: notificationManager.NotificationRequest = {
  3.  id: 10,
  4.  content: { // 通知内容：... }
  5. }
  6. // 发布通知
  7. notificationManager.publish(request)
  8.   .then(() => console.log('发布通知成功'))
  9.   .catch(reason => console.log('发布通知失败', JSON.stringify((reason))))

通知的类型主要有以下四种：

类型枚举说明
NOTIFICATION_CONTENT_BASIC_TEXT普通文本型
NOTIFICATION_CONTENT_LONG_TEXT长文本型
NOTIFICATION_CONTENT_MULTILINE多行文本型
NOTIFICATION_CONTENT_PICTURE图片型

3）取消通知：

  1. // 取消指定id的通知
  2. notificationManager.cancel(10)
  3. // 取消当前应用所有通知
  4. notificationManager.calcelAll()

接下来对基础通知的四种通知类型进行简单的讲解，具体使用参数使用可在publish出悬停，然后点击查阅API参考进行查看：

这里将常用的参数 SlotType 进行简单讲解一下，其下面的具体参数可参考以下的表格：

类型枚举说明状态栏图标提示音横幅
SOCIAL_COMMUNICATION社交类型是是是
SERVICE_INFORMATION服务类型是是否
CONTENT_INFORMATION内容类型是否否
OTHER_TYPES其他否否否

关于通知的消息需要在手机模拟器上才能显示，在本地预览器中是不能显示的：  

  1. import notify from '@ohos.notificationManager'
  2. import image from '@ohos.multimedia.image'
  3. import { Header } from '../common/components/CommonComponents'
  4.  
  5. @Entry
  6. @Component
  7. struct NotificationPage {
  8.   // 全局任务id
  9.   idx: number = 100
  10.   // 图象
  11.   pixel: PixelMap
  12.  
  13.   async aboutToAppear() {
  14.     // 获取资源管理器
  15.     let rm = getContext(this).resourceManager;
  16.     // 读取图片
  17.     let file = await rm.getMediaContent($r('app.media.watchGT4'))
  18.     // 创建PixelMap
  19.     image.createImageSource(file.buffer).createPixelMap()
  20.       .then(value => this.pixel = value)
  21.       .catch(reason => console.log('testTag', '加载图片异常', JSON.stringify(reason)))
  22.   }
  23.  
  24.   build() {
  25.     Column({space: 20}) {
  26.       Header({title: '通知功能'})
  27.  
  28.       Button(`发送normalText通知`)
  29.         .onClick(() => this.publishNormalTextNotification())
  30.       Button(`发送longText通知`)
  31.         .onClick(() => this.publishLongTextNotification())
  32.       Button(`发送multiLine通知`)
  33.         .onClick(() => this.publishMultiLineNotification())
  34.       Button(`发送Picture通知`)
  35.         .onClick(() => this.publishPictureNotification())
  36.     }
  37.     .width('100%')
  38.     .height('100%')
  39.     .padding(5)
  40.     .backgroundColor('#f1f2f3')
  41.   }
  42.  
  43.   // 普通文本发送
  44.   publishNormalTextNotification() {
  45.     let request: notify.NotificationRequest = {
  46.       id: this.idx++,
  47.       content: {
  48.         contentType: notify.ContentType.NOTIFICATION_CONTENT_BASIC_TEXT,
  49.         normal: {
  50.           title: '通知标题' + this.idx,
  51.           text: '通知内容详情',
  52.           additionalText: '通知附加内容'
  53.         }
  54.       },
  55.       showDeliveryTime: true,
  56.       deliveryTime: new Date().getTime(),
  57.       groupName: 'wechat',
  58.       slotType: notify.SlotType.SOCIAL_COMMUNICATION
  59.     }
  60.     this.publish(request)
  61.   }
  62.  
  63.   // 长文本发送
  64.   publishLongTextNotification() {
  65.     let request: notify.NotificationRequest = {
  66.       id: this.idx++,
  67.       content: {
  68.         contentType: notify.ContentType.NOTIFICATION_CONTENT_LONG_TEXT,
  69.         longText: {
  70.           title: '通知标题' + this.idx,
  71.           text: '通知内容详情',
  72.           additionalText: '通知附加内容',
  73.           longText: '通知中的长文本，我很长，我很长，我很长，我很长，我很长，我很长，我很长',
  74.           briefText: '通知概要和总结',
  75.           expandedTitle: '通知展开时的标题' + this.idx
  76.         }
  77.       }
  78.     }
  79.     this.publish(request)
  80.   }
  81.  
  82.   // 多行文本发送
  83.   publishMultiLineNotification() {
  84.     let request: notify.NotificationRequest = {
  85.       id: this.idx++,
  86.       content: {
  87.         contentType: notify.ContentType.NOTIFICATION_CONTENT_MULTILINE,
  88.         multiLine: {
  89.           title: '通知标题' + this.idx,
  90.           text: '通知内容详情',
  91.           additionalText: '通知附加内容',
  92.           briefText: '通知概要和总结',
  93.           longTitle: '展开时的标题，我很宽，我很宽，我很宽',
  94.           lines: [
  95.             '第一行',
  96.             '第二行',
  97.             '第三行',
  98.             '第四行',
  99.           ]
  100.         }
  101.       }
  102.     }
  103.     this.publish(request)
  104.   }
  105.  
  106.   // 图片型文本发送
  107.   publishPictureNotification() {
  108.     let request: notify.NotificationRequest = {
  109.       id: this.idx++,
  110.       content: {
  111.         contentType: notify.ContentType.NOTIFICATION_CONTENT_PICTURE,
  112.         picture: {
  113.           title: '通知标题' + this.idx,
  114.           text: '通知内容详情',
  115.           additionalText: '通知附加内容',
  116.           briefText: '通知概要和总结',
  117.           expandedTitle: '展开后标题' + this.idx,
  118.           picture: this.pixel
  119.         }
  120.       }
  121.     }
  122.     this.publish(request)
  123.   }
  124.  
  125.   private publish(request: notify.NotificationRequest) {
  126.     notify.publish(request)
  127.       .then(() => console.log('notify test', '发送通知成功'))
  128.       .then(reason => console.log('notify test', '发送通知失败', JSON.stringify(reason)))
  129.   }
  130. }

呈现的效果如下：

进度条通知

进度条通知会展示一个动态的进度条，主要用于文件下载，长任务处理的进度显示，下面是实现进度条的基本步骤：

1）判断当前系统是否支持进度条模板

  1. this.isSupport = await notify.isSupportTemplate('downloadTemplate')
  2. if(!this.isSupport) {
  3.   return 
  4. }

2）定义通知请求

  1. let template = {
  2.   name: 'downloadTemplate', // 模板名称，必须是downloadTemplate
  3.   data: {
  4.     progressValue: this.progressValue, // 进度条当前进度
  5.     progressMaxValue: this.progressMaxValue // 进度条的最大值
  6.   }
  7. }
  8. let request: notify.NotificationRequest = {
  9.   id: this.notificationId,
  10.   template: template,
  11.   wantAgent: this.wantAgentInstance,
  12.   content: {
  13.     contentType: notify.ContentType.NOTIFICATION_CONTENT_BASIC_TEXT,
  14.     normal: {
  15.       title: this.filename + ':  ' + this.state,
  16.       text: '',
  17.       additionalText: this.progressValue + '%'
  18.     }
  19.   }
  20. }

接下来对进度条进行实现：

  1. import notify from '@ohos.notificationManager'
  2. import wantAgent, { WantAgent } from '@ohos.app.ability.wantAgent'
  3. import promptAction from '@ohos.promptAction'
  4.  
  5. enum DownloadState {
  6.   NOT_BEGIN = '未开始',
  7.   DOWNLOADING = '下载中',
  8.   PAUSE = '已暂停',
  9.   FINISHED = '已完成',
  10. }
  11.  
  12. @Component
  13. export default struct DownloadCard {
  14.   // 下载进度
  15.   @State progressValue: number = 0
  16.   progressMaxValue: number = 100
  17.   // 任务状态
  18.   @State state: DownloadState = DownloadState.NOT_BEGIN
  19.  
  20.   // 下载的文件名
  21.   filename: string = '圣诞星.mp4'
  22.  
  23.   // 模拟下载的任务的id
  24.   taskId: number = -1
  25.  
  26.   // 通知id
  27.   notificationId: number = 999
  28.  
  29.   isSupport: boolean = false
  30.  
  31.   async aboutToAppear(){
  32.     // 判断当前系统是否支持进度条模板
  33.     this.isSupport = await notify.isSupportTemplate('downloadTemplate')
  34.   }
  35.  
  36.   build() {
  37.     Row({ space: 10 }) {
  38.       Image($r('app.media.ic_files_video')).width(50)
  39.       Column({ space: 5 }) {
  40.         Row() {
  41.           Text(this.filename)
  42.           Text(`${this.progressValue}%`).fontColor('#c1c2c1')
  43.         }
  44.         .width('100%')
  45.         .justifyContent(FlexAlign.SpaceBetween)
  46.  
  47.         Progress({
  48.           value: this.progressValue,
  49.           total: this.progressMaxValue,
  50.         })
  51.  
  52.         Row({ space: 5 }) {
  53.           Text(`${(this.progressValue * 0.43).toFixed(2)}MB`)
  54.             .fontSize(14).fontColor('#c1c2c1')
  55.           Blank()
  56.           if (this.state === DownloadState.NOT_BEGIN) {
  57.             Button('开始').downloadButton()
  58.               .onClick(() => this.download())
  59.  
  60.           } else if (this.state === DownloadState.DOWNLOADING) {
  61.             Button('取消').downloadButton().backgroundColor('#d1d2d3')
  62.               .onClick(() => this.cancel())
  63.  
  64.             Button('暂停').downloadButton()
  65.               .onClick(() => this.pause())
  66.  
  67.           } else if (this.state === DownloadState.PAUSE) {
  68.             Button('取消').downloadButton().backgroundColor('#d1d2d3')
  69.               .onClick(() => this.cancel())
  70.  
  71.             Button('继续').downloadButton()
  72.               .onClick(() => this.download())
  73.           } else {
  74.             Button('打开').downloadButton()
  75.               .onClick(() => this.open())
  76.           }
  77.         }.width('100%')
  78.       }
  79.       .layoutWeight(1)
  80.     }
  81.     .width('100%')
  82.     .borderRadius(20)
  83.     .padding(15)
  84.     .backgroundColor(Color.White)
  85.   }
  86.  
  87.  
  88.   cancel() {
  89.     // 取消定时任务
  90.     if(this.taskId > 0){
  91.       clearInterval(this.taskId);
  92.       this.taskId = -1
  93.     }
  94.     // 清理下载任务进度
  95.     this.progressValue = 0
  96.     // 标记任务状态：未开始
  97.     this.state = DownloadState.NOT_BEGIN
  98.     // 取消通知
  99.     notify.cancel(this.notificationId)
  100.   }
  101.  
  102.   download() {
  103.     // 清理旧任务
  104.     if(this.taskId > 0){
  105.       clearInterval(this.taskId);
  106.     }
  107.     // 开启定时任务，模拟下载
  108.     this.taskId = setInterval(() => {
  109.       // 判断任务进度是否达到100
  110.       if(this.progressValue >= 100){
  111.         // 任务完成了，应该取消定时任务
  112.         clearInterval(this.taskId)
  113.         this.taskId = -1
  114.         // 并且标记任务状态为已完成
  115.         this.state = DownloadState.FINISHED
  116.         // 发送通知
  117.         this.publishDownloadNotification()
  118.         return
  119.       }
  120.       // 模拟任务进度变更
  121.       this.progressValue += 2
  122.       // 发送通知
  123.       this.publishDownloadNotification()
  124.     }, 500)
  125.     // 标记任务状态：下载中
  126.     this.state = DownloadState.DOWNLOADING
  127.   }
  128.  
  129.   pause() {
  130.     // 取消定时任务
  131.     if(this.taskId > 0){
  132.       clearInterval(this.taskId);
  133.       this.taskId = -1
  134.     }
  135.     // 标记任务状态：已暂停
  136.     this.state = DownloadState.PAUSE
  137.     // 发送通知
  138.     this.publishDownloadNotification()
  139.   }
  140.  
  141.   open() {
  142.     promptAction.showToast({
  143.       message: '功能未实现'
  144.     })
  145.   }
  146.  
  147.   publishDownloadNotification(){
  148.     // 1.判断当前系统是否支持进度条模板
  149.     if(!this.isSupport){
  150.       // 当前系统不支持进度条模板
  151.       return
  152.     }
  153.     // 2.准备进度条模板的参数
  154.     let template = {
  155.       name: 'downloadTemplate', // 模板名称，必须是downloadTemplate
  156.       data: {
  157.         progressValue: this.progressValue, // 进度条当前进度
  158.         progressMaxValue: this.progressMaxValue // 进度条的最大值
  159.       }
  160.     }
  161.     let request: notify.NotificationRequest = {
  162.       id: this.notificationId,
  163.       template: template,
  164.       content: {
  165.         contentType: notify.ContentType.NOTIFICATION_CONTENT_BASIC_TEXT,
  166.         normal: {
  167.           title: this.filename + ':  ' + this.state,
  168.           text: '',
  169.           additionalText: this.progressValue + '%'
  170.         }
  171.       }
  172.     }
  173.     // 3.发送通知
  174.     notify.publish(request)
  175.       .then(() => console.log('test', '通知发送成功'))
  176.       .catch(reason => console.log('test', '通知发送失败！', JSON.stringify(reason)))
  177.   }
  178. }
  179.  
  180. @Extend(Button) function downloadButton() {
  181.   .width(75).height(28).fontSize(14)
  182. }

最终呈现的效果如下：

通知意图

我们可以给通知或者其中的按钮设置的行为意图（Want），从而实现拉起应用组件或发布公共事件的能力，下面是其实现的步骤：

  1. // 创建wantInfo信息
  2. let wantInfo: wantAgent.WantAgentInfo = {
  3.   wants: [
  4.     {
  5.       deviceId: '', // 设备的id
  6.       bundleName: 'com.example.myapplication', // 应用唯一标识
  7.       abilityName: 'EntryAbility', 
  8.       action: '',
  9.       entities: [], 
  10.     }
  11.   ],
  12.   requestCode: 0,
  13.   operationType: wantAgent.OperationType.START_ABILITY,
  14.   wantAgentFlags: [wantAgent.WantAgentFlags.CONSTANT_FLAG]
  15. }
  16. // 创建wantAgent实例
  17. this.wantAgentInstance = await wantAgent.getWantAgent(wantInfo)
  18. // 通知请求
  19. let request: notify.NotificationRequest = {
  20.   id: this.notificationId,
  21.   template: template,
  22.   wantAgent: this.wantAgentInstance, // 设置通知意图
  23.   content: {
  24.     // 
  25.   }
  26. }

通过上面的案例，我们给下载的进度条添加通知意图，让其下载的通知点击后跳转到下载页面，其实现的代码如下：

  1. import notify from '@ohos.notificationManager'
  2. import wantAgent, { WantAgent } from '@ohos.app.ability.wantAgent'
  3. import promptAction from '@ohos.promptAction'
  4.  
  5. enum DownloadState {
  6.   NOT_BEGIN = '未开始',
  7.   DOWNLOADING = '下载中',
  8.   PAUSE = '已暂停',
  9.   FINISHED = '已完成',
  10. }
  11.  
  12. @Component
  13. export default struct DownloadCard {
  14.   // 下载进度
  15.   @State progressValue: number = 0
  16.   progressMaxValue: number = 100
  17.   // 任务状态
  18.   @State state: DownloadState = DownloadState.NOT_BEGIN
  19.  
  20.   // 下载的文件名
  21.   filename: string = '圣诞星.mp4'
  22.  
  23.   // 模拟下载的任务的id
  24.   taskId: number = -1
  25.  
  26.   // 通知id
  27.   notificationId: number = 999
  28.  
  29.   isSupport: boolean = false
  30.  
  31.   wantAgentInstance: WantAgent
  32.  
  33.   async aboutToAppear(){
  34.     // 1.判断当前系统是否支持进度条模板
  35.     this.isSupport = await notify.isSupportTemplate('downloadTemplate')
  36.     // 2.创建拉取当前应用的行为意图
  37.     // 2.1.创建wantInfo信息
  38.     let wantInfo: wantAgent.WantAgentInfo = {
  39.       wants: [
  40.         {
  41.           bundleName: 'com.example.myapplication',
  42.           abilityName: 'EntryAbility',
  43.         }
  44.       ],
  45.       requestCode: 0,
  46.       operationType: wantAgent.OperationType.START_ABILITY,
  47.       wantAgentFlags: [wantAgent.WantAgentFlags.CONSTANT_FLAG]
  48.     }
  49.     // 2.2.创建wantAgent实例
  50.     this.wantAgentInstance = await wantAgent.getWantAgent(wantInfo)
  51.   }
  52.  
  53.   build() {
  54.     Row({ space: 10 }) {
  55.       Image($r('app.media.ic_files_video')).width(50)
  56.       Column({ space: 5 }) {
  57.         Row() {
  58.           Text(this.filename)
  59.           Text(`${this.progressValue}%`).fontColor('#c1c2c1')
  60.         }
  61.         .width('100%')
  62.         .justifyContent(FlexAlign.SpaceBetween)
  63.  
  64.         Progress({
  65.           value: this.progressValue,
  66.           total: this.progressMaxValue,
  67.         })
  68.  
  69.         Row({ space: 5 }) {
  70.           Text(`${(this.progressValue * 0.43).toFixed(2)}MB`)
  71.             .fontSize(14).fontColor('#c1c2c1')
  72.           Blank()
  73.           if (this.state === DownloadState.NOT_BEGIN) {
  74.             Button('开始').downloadButton()
  75.               .onClick(() => this.download())
  76.  
  77.           } else if (this.state === DownloadState.DOWNLOADING) {
  78.             Button('取消').downloadButton().backgroundColor('#d1d2d3')
  79.               .onClick(() => this.cancel())
  80.  
  81.             Button('暂停').downloadButton()
  82.               .onClick(() => this.pause())
  83.  
  84.           } else if (this.state === DownloadState.PAUSE) {
  85.             Button('取消').downloadButton().backgroundColor('#d1d2d3')
  86.               .onClick(() => this.cancel())
  87.  
  88.             Button('继续').downloadButton()
  89.               .onClick(() => this.download())
  90.           } else {
  91.             Button('打开').downloadButton()
  92.               .onClick(() => this.open())
  93.           }
  94.         }.width('100%')
  95.       }
  96.       .layoutWeight(1)
  97.     }
  98.     .width('100%')
  99.     .borderRadius(20)
  100.     .padding(15)
  101.     .backgroundColor(Color.White)
  102.   }
  103.  
  104.  
  105.   cancel() {
  106.     // 取消定时任务
  107.     if(this.taskId > 0){
  108.       clearInterval(this.taskId);
  109.       this.taskId = -1
  110.     }
  111.     // 清理下载任务进度
  112.     this.progressValue = 0
  113.     // 标记任务状态：未开始
  114.     this.state = DownloadState.NOT_BEGIN
  115.     // 取消通知
  116.     notify.cancel(this.notificationId)
  117.   }
  118.  
  119.   download() {
  120.     // 清理旧任务
  121.     if(this.taskId > 0){
  122.       clearInterval(this.taskId);
  123.     }
  124.     // 开启定时任务，模拟下载
  125.     this.taskId = setInterval(() => {
  126.       // 判断任务进度是否达到100
  127.       if(this.progressValue >= 100){
  128.         // 任务完成了，应该取消定时任务
  129.         clearInterval(this.taskId)
  130.         this.taskId = -1
  131.         // 并且标记任务状态为已完成
  132.         this.state = DownloadState.FINISHED
  133.         // 发送通知
  134.         this.publishDownloadNotification()
  135.         return
  136.       }
  137.       // 模拟任务进度变更
  138.       this.progressValue += 2
  139.       // 发送通知
  140.       this.publishDownloadNotification()
  141.     }, 500)
  142.     // 标记任务状态：下载中
  143.     this.state = DownloadState.DOWNLOADING
  144.   }
  145.  
  146.   pause() {
  147.     // 取消定时任务
  148.     if(this.taskId > 0){
  149.       clearInterval(this.taskId);
  150.       this.taskId = -1
  151.     }
  152.     // 标记任务状态：已暂停
  153.     this.state = DownloadState.PAUSE
  154.     // 发送通知
  155.     this.publishDownloadNotification()
  156.   }
  157.  
  158.   open() {
  159.     promptAction.showToast({
  160.       message: '功能未实现'
  161.     })
  162.   }
  163.  
  164.   publishDownloadNotification(){
  165.     // 1.判断当前系统是否支持进度条模板
  166.     if(!this.isSupport){
  167.       // 当前系统不支持进度条模板
  168.       return
  169.     }
  170.     // 2.准备进度条模板的参数
  171.     let template = {
  172.       name: 'downloadTemplate', // 模板名称，必须是downloadTemplate
  173.       data: {
  174.         progressValue: this.progressValue, // 进度条当前进度
  175.         progressMaxValue: this.progressMaxValue // 进度条的最大值
  176.       }
  177.     }
  178.     let request: notify.NotificationRequest = {
  179.       id: this.notificationId,
  180.       template: template,
  181.       wantAgent: this.wantAgentInstance, // 设置通知意图
  182.       content: {
  183.         contentType: notify.ContentType.NOTIFICATION_CONTENT_BASIC_TEXT,
  184.         normal: {
  185.           title: this.filename + ':  ' + this.state,
  186.           text: '',
  187.           additionalText: this.progressValue + '%'
  188.         }
  189.       }
  190.     }
  191.     // 3.发送通知
  192.     notify.publish(request)
  193.       .then(() => console.log('test', '通知发送成功'))
  194.       .catch(reason => console.log('test', '通知发送失败！', JSON.stringify(reason)))
  195.   }
  196. }
  197.  
  198. @Extend(Button) function downloadButton() {
  199.   .width(75).height(28).fontSize(14)
  200. }

呈现的效果如下：

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小丑西瓜9/article/detail/350165
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号