Harmony-UIAbility组件与UI的数据同步

这篇具有很好参考价值的文章主要介绍了Harmony-UIAbility组件与UI的数据同步。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

UIAbility组件与UI的数据同步

基于HarmonyOS的应用模型,可以通过以下两种方式来实现UIAbility组件与UI之间的数据同步。

  • 使用EventHub进行数据通信:基于发布订阅模式来实现,事件需要先订阅后发布,订阅者收到消息后进行处理。

  • 使用globalThis进行数据同步:ArkTS引擎实例内部的一个全局对象,在ArkTS引擎实例内部都能访问。

  • 使用AppStorage/LocalStorage进行数据同步:ArkUI提供了AppStorage和LocalStorage两种应用级别的状态管理方案,可用于实现应用级别和UIAbility级别的数据同步。

使用EventHub进行数据通信

EventHub提供了UIAbility组件/ExtensionAbility组件级别的事件机制,以UIAbility组件/ExtensionAbility组件为中心提供了订阅、取消订阅和触发事件的数据通信能力。接口说明请参见EventHub。

在使用EventHub之前,首先需要获取EventHub对象。基类Context提供了EventHub对象,本章节以使用EventHub实现UIAbility与UI之间的数据通信为例进行说明。

  1. 在UIAbility中调用eventHub.on()方法注册一个自定义事件“event1”,eventHub.on()有如下两种调用方式,使用其中一种即可。

    import UIAbility from '@ohos.app.ability.UIAbility';
    
    const TAG: string = '[Example].[Entry].[EntryAbility]';
    
    export default class EntryAbility extends UIAbility {
        func1(...data) {
            // 触发事件,完成相应的业务操作
            console.info(TAG, '1. ' + JSON.stringify(data));
        }
    
        onCreate(want, launch) {
            // 获取eventHub
            let eventhub = this.context.eventHub;
            // 执行订阅操作
            eventhub.on('event1', this.func1);
            eventhub.on('event1', (...data) => {
                // 触发事件,完成相应的业务操作
                console.info(TAG, '2. ' + JSON.stringify(data));
            });
        }
    }
    
  2. 在UI界面中通过eventHub.emit()方法触发该事件,在触发事件的同时,根据需要传入参数信息。

    import common from '@ohos.app.ability.common';
    
    @Entry
    @Component
    struct Index {
      private context = getContext(this) as common.UIAbilityContext;
    
      eventHubFunc() {
        // 不带参数触发自定义“event1”事件
        this.context.eventHub.emit('event1');
        // 带1个参数触发自定义“event1”事件
        this.context.eventHub.emit('event1', 1);
        // 带2个参数触发自定义“event1”事件
        this.context.eventHub.emit('event1', 2, 'test');
        // 开发者可以根据实际的业务场景设计事件传递的参数
      }
    
      // 页面展示
      build() {
        // ...
      }
    }
    
  3. 在UIAbility的注册事件回调中可以得到对应的触发事件结果,运行日志结果如下所示。

    []
    
    [1]
    
    [2,'test']
    
  4. 在自定义事件“event1”使用完成后,可以根据需要调用eventHub.off()方法取消该事件的订阅。

    // context为UIAbility实例的AbilityContext
    this.context.eventHub.off('event1');
    

使用globalThis进行数据同步

globalThis是ArkTS引擎实例内部的一个全局对象,引擎内部的UIAbility/ExtensionAbility/Page都可以使用,因此可以使用globalThis全局对象进行数据同步。

图1 使用globalThis进行数据同步

Harmony-UIAbility组件与UI的数据同步,第二版鸿蒙深入开发(HarmonyOS),ui,harmonyos,华为,鸿蒙系统,前端

如上图所示,下面来具体介绍globalThis的使用:

  • UIAbility和Page之间使用globalThis
  • UIAbility和UIAbility之间使用globalThis
  • globalThis使用的注意事项

UIAbility和Page之间使用globalThis

globalThis为ArkTS引擎实例下的全局对象,可以通过globalThis绑定属性/方法来进行UIAbility组件与UI的数据同步。例如在UIAbility组件中绑定want参数,即可在UIAbility对应的UI界面上使用want参数信息。

  1. 调用startAbility()方法启动一个UIAbility实例时,被启动的UIAbility创建完成后会进入onCreate()生命周期回调,且在onCreate()生命周期回调中能够接受到传递过来的want参数,可以将want参数绑定到globalThis上。

    import UIAbility from '@ohos.app.ability.UIAbility'
    
    export default class EntryAbility extends UIAbility {
        onCreate(want, launch) {
            globalThis.entryAbilityWant = want;
            // ...
        }
    
        // ...
    }
    
  2. 在UI界面中即可通过globalThis获取到want参数信息。

    let entryAbilityWant;
    
    @Entry
    @Component
    struct Index {
      aboutToAppear() {
        entryAbilityWant = globalThis.entryAbilityWant;
      }
    
      // 页面展示
      build() {
        // ...
      }
    }
    

UIAbility和UIAbility之间使用globalThis

同一个应用中UIAbility和UIAbility之间的数据传递,可以通过将数据绑定到全局变量globalThis上进行同步,如在AbilityA中将数据保存在globalThis,然后跳转到AbilityB中取得该数据:

  1. AbilityA中保存数据一个字符串数据并挂载到globalThis上。

    import UIAbility from '@ohos.app.ability.UIAbility'
    
    export default class AbilityA extends UIAbility {
        onCreate(want, launch) {
            globalThis.entryAbilityStr = 'AbilityA'; // AbilityA存放字符串“AbilityA”到globalThis
            // ...
        }
    }
    
  2. AbilityB中获取对应的数据。

    import UIAbility from '@ohos.app.ability.UIAbility'
    
    export default class AbilityB extends UIAbility {
        onCreate(want, launch) {
            // AbilityB从globalThis读取name并输出
            console.info('name from entryAbilityStr: ' + globalThis.entryAbilityStr);
            // ...
        }
    }
    

globalThis使用的注意事项

图2 globalThis注意事项

Harmony-UIAbility组件与UI的数据同步,第二版鸿蒙深入开发(HarmonyOS),ui,harmonyos,华为,鸿蒙系统,前端

  • Stage模型下进程内的UIAbility组件共享ArkTS引擎实例,使用globalThis时需要避免存放相同名称的对象。例如AbilityA和AbilityB可以使用globalThis共享数据,在存放相同名称的对象时,先存放的对象会被后存放的对象覆盖。
  • FA模型因为每个UIAbility组件之间引擎隔离,不会存在该问题。
  • 对于绑定在globalThis上的对象,其生命周期与ArkTS虚拟机实例相同,建议在使用完成之后将其赋值为null,以减少对应用内存的占用。

Stage模型上同名对象覆盖导致问题的场景举例说明。

  1. 在AbilityA文件中使用globalThis存放了UIAbilityContext。

    import UIAbility from '@ohos.app.ability.UIAbility'
    
    export default class AbilityA extends UIAbility {
        onCreate(want, launch) {
            globalThis.context = this.context; // AbilityA存放context到globalThis
            // ...
        }
    }
    
  2. 在AbilityA的页面中获取该UIAbilityContext并进行使用。使用完成后将AbilityA实例切换至后台。

    @Entry
    @Component
    struct Index {
      onPageShow() {
        let ctx = globalThis.context; // 页面中从globalThis中取出context并使用
        let permissions = ['com.example.permission']
        ctx.requestPermissionsFromUser(permissions,(result) => {
           // ...
        });
      }
      // 页面展示
      build() {
        // ...
      }
    }
    
  3. 在AbilityB文件中使用globalThis存放了UIAbilityContext,并且命名为相同的名称。

    import UIAbility from '@ohos.app.ability.UIAbility'
    
    export default class AbilityB extends UIAbility {
        onCreate(want, launch) {
            // AbilityB覆盖了AbilityA在globalThis中存放的context
            globalThis.context = this.context;
            // ...
        }
    }
    
  4. 在AbilityB的页面中获取该UIAbilityContext并进行使用。此时获取到的globalThis.context已经表示为AbilityB中赋值的UIAbilityContext内容。

    @Entry
    @Component
    struct Index {
      onPageShow() {
        let ctx = globalThis.context; // Page中从globalThis中取出context并使用
        let permissions = ['com.example.permission']
        ctx.requestPermissionsFromUser(permissions,(result) => {
          console.info('requestPermissionsFromUser result:' + JSON.stringify(result));
        });
      }
      // 页面展示
      build() {
        // ...
      }
    }
    
  5. 在AbilityB实例切换至后台,将AbilityA实例从后台切换回到前台。此时AbilityA的onCreate生命周期不会再次进入。

    import UIAbility from '@ohos.app.ability.UIAbility'
    
    export default class AbilityA extends UIAbility {
        onCreate(want, launch) { // AbilityA从后台进入前台,不会再走这个生命周期
            globalThis.context = this.context;
            // ...
        }
    }
    
  6. 在AbilityA的页面再次回到前台时,其获取到的globalThis.context表示的为AbilityB的UIAbilityContext,而不是AbilityA的UIAbilityContext,在AbilityA的页面中使用则会出错。

    @Entry
    @Component
    struct Index {
      onPageShow() {
        let ctx = globalThis.context; // 这时候globalThis中的context是AbilityB的context
        let permissions=['com.example.permission'];
        ctx.requestPermissionsFromUser(permissions,(result) => { // 使用这个对象就会导致进程崩溃
           console.info('requestPermissionsFromUser result:' + JSON.stringify(result));
        });
      }
      // 页面展示
      build() {
        // ...
      }
    }
    

使用AppStorage/LocalStorage进行数据同步

ArkUI提供了AppStorage和LocalStorage两种应用级别的状态管理方案,可用于实现应用级别和UIAbility级别的数据同步。使用这些方案可以方便地管理应用状态,提高应用性能和用户体验。其中,AppStorage是一个全局的状态管理器,适用于多个UIAbility共享同一状态数据的情况;而LocalStorage则是一个局部的状态管理器,适用于单个UIAbility内部使用的状态数据。通过这两种方案,开发者可以更加灵活地控制应用状态,提高应用的可维护性和可扩展性。详细请参见应用级变量的状态管理。文章来源地址https://www.toymoban.com/news/detail-837109.html

到了这里,关于Harmony-UIAbility组件与UI的数据同步的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Harmony OS—UIAbility的使用

    UIAbility是一种包含用户界面的应用组件,主要用于和用户进行交互。UIAbility也是系统调度的单元,为应用提供窗口在其中绘制界面。一个应用可以有一个UIAbility,也可以有多个UIAbility,类似于Android 的 Activity,如果有安卓基础的同学,也可以结合过往知识点学习。比如 设置路

    2024年02月04日
    浏览(41)
  • Stage模型详解,UIability------Harmony OS 开发(第五期)

    如上图所示,蓝色框内就是代表一个模块, 一个工程下可以有n个模块,但只能有一个entry模块,即入口模块(核心),里面是该APP的主要功能 。模块分为两种类型: Ability Module和Library Module模块 ,前者是能力模块,用于实现对应的页面和功能,后者是共享模块,里面的功能和已经创

    2024年01月24日
    浏览(48)
  • 《Jetpack Compose从入门到实战》 第二章 了解常用UI组件

    书附代码 Google的图标库 ConstraintLayout约束布局需要依赖:implementation “androidx.constraintlayout:constraintlayout-compose: $constraintlayout _version” 《Jetpack Compose从入门到实战》第一章 全新的 Android UI 框架 《Jetpack Compose从入门到实战》 第二章 了解常用UI组件 《Jetpack Compose从入门到实战》

    2024年02月07日
    浏览(49)
  • OpenHarmony—UIAbility组件生命周期

    概述 当用户打开、切换和返回到对应应用时,应用中的UIAbility实例会在其生命周期的不同状态之间转换。UIAbility类提供了一系列回调,通过这些回调可以知道当前UIAbility实例的某个状态发生改变,会经过UIAbility实例的创建和销毁,或者UIAbility实例发生了前后台的状态切换。

    2024年02月20日
    浏览(41)
  • 鸿蒙开发:UIAbility组件间交互探索实战

    在设备内,UIAbility(用户界面能力)是系统调度的最小单元,它们负责展示用户界面和执行相关的业务逻辑。设备内的不同功能模块之间的交互是应用程序开发中的重要部分。本文将探讨设备内UIAbility之间的交互方式,包括启动应用内的UIAbility、启动其他应用的UIAbility以及通

    2024年02月04日
    浏览(50)
  • OpenHarmony—UIAbility组件间交互(设备内)

    UIAbility是系统调度的最小单元。在设备内的功能模块之间跳转时,会涉及到启动特定的UIAbility,该UIAbility可以是应用内的其他UIAbility,也可以是其他应用的UIAbility(例如启动三方支付UIAbility)。 本章节将从如下场景分别介绍设备内UIAbility间的交互方式。 启动应用内的UIAbili

    2024年02月21日
    浏览(42)
  • 鸿蒙开发:UIAbility组件间交互探索实战【鸿蒙专栏-22】

    在设备内,UIAbility(用户界面能力)是系统调度的最小单元,它们负责展示用户界面和执行相关的业务逻辑。设备内的不同功能模块之间的交互是应用程序开发中的重要部分。本文将探讨设备内UIAbility之间的交互方式,包括启动应用内的UIAbility、启动其他应用的UIAbility以及通

    2024年02月05日
    浏览(42)
  • 【鸿蒙软件开发】UIAbility组件概况、生命周期与启动模式

    UIAbility组件是一种包含UI界面的应用组件,主要用于和用户交互。 UIAbility组件是系统调度的基本单元,为应用提供绘制界面的窗口;一个UIAbility组件中可以通过多个页面来实现一个功能模块。每一个UIAbility组件实例,都对应于一个最近任务列表中的任务。 UIAbility组件是一种包

    2024年02月05日
    浏览(62)
  • HarmonyOS 应用开发之UIAbility组件间交互(设备内)

    UIAbility是系统调度的最小单元。在设备内的功能模块之间跳转时,会涉及到启动特定的UIAbility,该UIAbility可以是应用内的其他UIAbility,也可以是其他应用的UIAbility(例如启动三方支付UIAbility)。 本文将从如下场景分别介绍设备内UIAbility间的交互方式。对于跨设备的应用组件交

    2024年04月12日
    浏览(35)
  • HarmonyOS/OpenHarmony应用开发-Stage模型UIAbility组件使用(一)

    一、UIAbility组件概述 1.概述 UIAbility组件是一种包含UI界面的应用组件,主要用于和用户交互。 UIAbility组件是系统调度的基本单元,为应用提供绘制界面的窗口;一个UIAbility组件中可以通过多个页面来实现一个功能模块。每一个UIAbility组件实例,都对应于一个最近任务列表中的

    2024年02月11日
    浏览(54)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包