文档管理中心

分享

场景介绍

从6.0.0(20)开始,支持元服务页面的分享。可通过服务面板入口进行当前页面的分享,也可通过分享Button组件在元服务页面内嵌入实现。

展开

元服务分享

适用范围

分享入口

使用接口或组件

元服务页面分享

适用于ArkUI开发的元服务页面

服务面板

onShare生命周期函数

页面内自定义

元服务分享Button

接入指导

本能力依赖于组件导航(Navigation)能力,使用Navigation来实现元服务的分页能力。

开发者需要在元服务工程中,在UIAbility中配置onShare生命周期函数,在wantParams中声明atomicservice.param.key.shareInfo表示分享方要分享页面数据。

元服务面板能够依赖此数据根据判断用户所处分页是否允许分享,进而构建分享数据,拉起系统分享面板。

收起
自动换行
深色代码主题
复制
  1. import UIAbility from '@ohos.app.ability.UIAbility';
  2. interface ShareInfo {
  3. showShareMenu: boolean; // 当前页面是否允许分享,面板分享开关是否打开, 不填默认为不允许。
  4. title?: string; // 系统分享面板标题,默认为元服务名称。
  5. description?: string; // 系统分享面板简介,默认为元服务一句话描述。
  6. }
  7. export default class EntryAbility extends UIAbility {
  8. onShare(wantParams: Record<string, Object>) {
  9. /*
  10. * 定义分享数据
  11. */
  12. const shareInfo: ShareInfo = {
  13. showShareMenu: true,
  14. title: '分享标题',
  15. description: '分享简介',
  16. }
  17. wantParams['atomicservice.param.key.shareInfo'] = shareInfo;
  18. }
  19. //...
  20. }

NavigationSubPageName指的是开发者在navigation中使用NavDestination页面名称,以下是自定义路由表的实现举例。

收起
自动换行
深色代码主题
复制
  1. // 使用navigation组件一般通过如下方式更新页面。
  2. @Entry
  3. @Component
  4. struct NavigationExample {
  5. pageInfos: NavPathStack = new NavPathStack();
  6. isUseInterception: boolean = false;
  7. @Builder
  8. pageMap(pageName: string, params: Record<string, string>) {
  9. if (pageName === NavigationSubPageName.PageOne) {
  10. PageOne()
  11. } else if (pageName === NavigationSubPageName.PageTwo) {
  12. PageTwo()
  13. } else if (pageName === NavigationSubPageName.PageThree) {
  14. PageThree()
  15. }
  16. }
  17. build() {
  18. Navigation(this.pageInfos) {
  19. Column() {
  20. Button('pushPath', { stateEffect: true, type: ButtonType.Capsule })
  21. .width('80%')
  22. .height(40)
  23. .margin(20)
  24. .onClick(() => {
  25. this.pageInfos.pushPath({ name: NavigationSubPageName.PageOne }); //将name指定的NavDestination页面信息入栈
  26. })
  27. Button('use interception', { stateEffect: true, type: ButtonType.Capsule })
  28. .width('80%')
  29. .height(40)
  30. .margin(20)
  31. .onClick(() => {
  32. this.isUseInterception = !this.isUseInterception;
  33. if (this.isUseInterception) {
  34. this.registerInterception();
  35. } else {
  36. this.pageInfos.setInterception(undefined);
  37. }
  38. })
  39. }
  40. }.navDestination(this.pageMap)
  41. }
  42. }
在 指南 中进行搜索
请输入您想要搜索的关键词