devbox
黑客灵魂
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

【鸿蒙开发】生命周期_ability的生命周期回调函数

作者：黑客灵魂 | 2024-07-17 14:56:45

赞

踩

ability的生命周期回调函数

1. UIAbility组件生命周期

UIAbility的生命周期包括Create、Foreground、Background、Destroy四个状态。

UIAbility生命周期状态

 1.1 Create状态

Create状态为在应用加载过程中，UIAbility实例创建完成时触发，系统会调用onCreate()回调。可以在该回调中进行页面初始化操作，例如变量定义资源加载等，用于后续的UI界面展示。

  1. import UIAbility from '@ohos.app.ability.UIAbility';
  2. import Window from '@ohos.window';
  3.  
  4. export default class EntryAbility extends UIAbility {
  5.     onCreate(want, launchParam) {
  6.         // 页面初始化
  7.     }
  8.     // ...
  9. }

1.2 WindowStageCreate和WindowStageDestroy状态

UIAbility实例创建完成之后，在进入Foreground之前，系统会创建一个WindowStage。WindowStage创建完成后会进入onWindowStageCreate()回调，可以在该回调中设置UI界面加载、设置WindowStage的事件订阅。

在onWindowStageCreate()回调中通过loadContent()方法设置应用要加载的页面并根据需要订阅WindowStage的事件（获焦/失焦、可见/不可见）。

  1. import UIAbility from '@ohos.app.ability.UIAbility';
  2. import Window from '@ohos.window';
  3.  
  4. export default class EntryAbility extends UIAbility {
  5.     onWindowStageCreate(windowStage: Window.WindowStage) {
  6.         // 设置WindowStage的事件订阅（获焦/失焦、可见/不可见）
  7.  
  8.         // 设置UI界面加载
  9.         windowStage.loadContent('pages/Index', (err, data) => {
  10.             // ...
  11.         });
  12.     }
  13. }

在UIAbility实例销毁之前会进入onWindowStageDestroy()回调，可以释放UI界面资源。

  1. import UIAbility from '@ohos.app.ability.UIAbility';
  2. import Window from '@ohos.window';
  3.  
  4. export default class EntryAbility extends UIAbility {
  5.     // ...
  6.  
  7.     onWindowStageDestroy() {
  8.         // 释放UI界面资源
  9.     }
  10. }
  • onCreate：在 Ability 创建时被调用，用于执行初始化和设置业务逻辑。
  • onDestroy：在 Ability 销毁时触发，用于执行资源清理和其他清理操作。
  • onWindowStageCreate：在 WindowStage 创建完成后触发。
  • onWindowStageDestroy：在 WindowStage 销毁后触发。
  • onForeground：Ability 的生命周期回调，当应用从后台切换到前台时调用。
  • onBackground：Ability 的生命周期回调，当应用从前台切换到后台时调用。

2. 页面和自定义组件生命周期

2.1 页面生命周期

即被@Entry装饰的组件生命周期，提供以下生命周期接口：

  • onPageShow：页面每次显示时触发一次，包括路由过程、应用进入前台等场景。
  • onPageHide：页面每次隐藏时触发一次，包括路由过程、应用进入后台等场景。
  • onBackPress：当用户点击返回按钮时触发。

2.2 组件生命周期

即一般用@Component装饰的自定义组件的生命周期，提供以下生命周期接口：

  • aboutToAppear：组件即将出现时回调该接口，具体时机为在创建自定义组件的新实例后，在执行其build()函数之前执行。
  • aboutToDisappear：在自定义组件析构销毁之前执行。不允许在aboutToDisappear函数中改变状态变量，特别是@Link变量的修改可能会导致应用程序行为不稳定。

2.3 生命周期流程

下图展示的是被@Entry装饰的组件（页面）生命周期。

2.4 自定义组件的渲染流程

  • ArkUI框架创建自定义组件
  • 初始化自定义组件的成员变量
  • 执行aboutToAppear方法
  • 执行build方法渲染组件，在首次渲染时，框架会记录状态变量和组件的映射关系
  • 当状态变量的值更改时，框架根据映射关系，执行这些UI组件的更新函数
  • if分支或者ForEach渲染的数组个数改变，组件将被删除，在删除前执行aboutToDisappear

不建议在aboutToDisappear内使用async await，如果在aboutToDisappear使用中Promise或者回调方法，自定义组件将被保留在Promise的闭包中，直到回调方法被执行完，这个行为阻止了自定义组件的垃圾回收。

 2.5 示例

  1. import router from '@ohos.router'
  2.  
  3. @Entry
  4. @Component
  5. struct Index {
  6.   @State showChild: boolean = true;
  7.  
  8.   // 页面生命周期
  9.   onPageShow() {
  10.     console.info('Index onPageShow');
  11.   }
  12.   // 页面生命周期
  13.   onPageHide() {
  14.     console.info('Index onPageHide');
  15.   }
  16.   // 页面生命周期
  17.   onBackPress() {
  18.     console.info('Index onBackPress');
  19.   }
  20.  
  21.   // 组件生命周期
  22.   aboutToAppear() {
  23.     console.info('Index aboutToAppear');
  24.   }
  25.   // 组件生命周期
  26.   aboutToDisappear() {
  27.     console.info('Index aboutToDisappear');
  28.   }
  29.  
  30.   build() {
  31.     Column() {
  32.       // this.showChild为true，创建Child子组件，执行Child aboutToAppear
  33.       if (this.showChild) {
  34.         Child()
  35.       }
  36.       // this.showChild为false，删除Child子组件，执行Child aboutToDisappear
  37.       Button('删除子组件 Child')
  38.         .margin({ bottom: 20 })
  39.         .onClick(() => {
  40.           this.showChild = false;
  41.         })
  42.       // push到DetailPage页面，执行onPageHide
  43.       Button('跳转到 DetailPage')
  44.         .onClick(() => {
  45.           router.pushUrl({ url: 'pages/DetailPage' });
  46.         })
  47.     }
  48.     .width("100%")
  49.     .height("100%")
  50.   }
  51. }
  52.  
  53. @Component
  54. struct Child {
  55.   @State title: string = 'Child';
  56.  
  57.   // 组件生命周期
  58.   aboutToAppear() {
  59.     console.info('Child aboutToAppear')
  60.   }
  61.   // 组件生命周期
  62.   aboutToDisappear() {
  63.     console.info('Child aboutToDisappear')
  64.   }
  65.  
  66.   build() {
  67.     Text(this.title).fontSize(50).onClick(() => {
  68.       this.title = 'Child Click';
  69.     })
  70.   }
  71. }

3. 同模块下的UIAbility跳转

3.1 创建 PaymentPage

  1. @Entry
  2. @Component
  3. struct PaymentPage {
  4.   @State message: string = 'payment page'
  5.  
  6.   build() {
  7.     Row() {
  8.       Column() {
  9.         Text(this.message)
  10.           .fontSize(50)
  11.           .fontWeight(FontWeight.Bold)
  12.       }
  13.       .width('100%')
  14.     }
  15.     .height('100%')
  16.   }
  17. }

3.2 创建 PaymentAbility

修改 windowStage.loadContent 加载的页面

3.3 修改 Index.ets

  1. import common from '@ohos.app.ability.common'
  2. import Want from '@ohos.app.ability.Want'
  3.  
  4. @Entry
  5. @Component
  6. struct Index {
  7.   @State message: string = 'index page'
  8.  
  9.   build() {
  10.     Row() {
  11.       Column() {
  12.         Text(this.message)
  13.           .fontSize(50)
  14.           .fontWeight(FontWeight.Bold)
  15.  
  16.         Button("去支付")
  17.           .width('100%')
  18.           .onClick(() => {
  19.             const context = getContext(this) as common.UIAbilityContext;
  20.             const want: Want = {
  21.               'deviceId': '', // deviceId为空表示本设备
  22.               'bundleName': 'com.example.myapplication',
  23.               'abilityName': 'PaymentAbility',
  24.               'moduleName': 'entry'
  25.             }
  26.             context.startAbility(want)
  27.           })
  28.       }
  29.       .width('100%')
  30.     }
  31.     .height('100%')
  32.   }
  33. }

4. 不同模块下的UIAbility跳转

4.1 创建模块

4.2 修改 paymentModule 模块的 Index.ets

  1. @Entry
  2. @Component
  3. struct Index {
  4.   @State message: string = 'payment module page'
  5.  
  6.   build() {
  7.     Row() {
  8.       Column() {
  9.         Text(this.message)
  10.           .fontSize(50)
  11.           .fontWeight(FontWeight.Bold)
  12.       }
  13.       .width('100%')
  14.     }
  15.     .height('100%')
  16.   }
  17. }

4.3 修改 entry 模块的 Index.ets

修改 abilityName 和 moduleName

  1. import common from '@ohos.app.ability.common'
  2. import Want from '@ohos.app.ability.Want'
  3.  
  4. @Entry
  5. @Component
  6. struct Index {
  7.   @State message: string = 'index page'
  8.  
  9.   build() {
  10.     Row() {
  11.       Column() {
  12.         Text(this.message)
  13.           .fontSize(50)
  14.           .fontWeight(FontWeight.Bold)
  15.  
  16.         Button("去支付")
  17.           .width('100%')
  18.           .onClick(() => {
  19.             const context = getContext(this) as common.UIAbilityContext;
  20.             const want: Want = {
  21.               'deviceId': '', // deviceId为空表示本设备
  22.               'bundleName': 'com.example.myapplication',
  23.               'abilityName': 'PaymentModuleAbility',
  24.               'moduleName': 'paymentModule'
  25.             }
  26.             context.startAbility(want)
  27.           })
  28.       }
  29.       .width('100%')
  30.     }
  31.     .height('100%')
  32.   }
  33. }

4.4 配置调起2个模块

 

4.5 两个模块之间传递数据

4.5.1 修改 entry 模块的 Index.ets

使用 parameters 选项添加自定义数据

使用 context.startAbilityForResult 方法启动 UIAbility 并获取返回结果

  1. import common from '@ohos.app.ability.common'
  2. import Want from '@ohos.app.ability.Want'
  3.  
  4. type PaymentAbilityParams = Record<string, boolean>
  5.  
  6. @Entry
  7. @Component
  8. struct Index {
  9.   @State message: string = 'index page'
  10.  
  11.   build() {
  12.     Row() {
  13.       Column() {
  14.         Text(this.message)
  15.           .fontSize(50)
  16.           .fontWeight(FontWeight.Bold)
  17.  
  18.         Button("去支付")
  19.           .width('100%')
  20.           .onClick(async () => {
  21.             const context = getContext(this) as common.UIAbilityContext;
  22.             const want: Want = {
  23.               deviceId: '', // deviceId为空表示本设备
  24.               bundleName: 'com.example.myapplication',
  25.               abilityName: 'PaymentModuleAbility',
  26.               moduleName: 'paymentModule',
  27.               parameters: {
  28.                 orderId: Date.now()
  29.               }
  30.             }
  31.             // context.startAbility(want)
  32.             const paymentAbilityResult = await context.startAbilityForResult(want)
  33.             const params = paymentAbilityResult.want?.parameters as PaymentAbilityParams
  34.             if (params?.isPay) {
  35.               AlertDialog.show({
  36.                 message: "支付成功"
  37.               })
  38.             } else {
  39.               AlertDialog.show({
  40.                 message: "支付失败"
  41.               })
  42.             }
  43.           })
  44.       }
  45.       .width('100%')
  46.     }
  47.     .height('100%')
  48.   }
  49. }
4.5.2 修改 paymentModule 模块的 PaymentModuleAbility

在 UIAbility 的 onCreate 中接收参数，并保存到 AppStorage 中

  1. import UIAbility from '@ohos.app.ability.UIAbility';
  2. import hilog from '@ohos.hilog';
  3. import window from '@ohos.window';
  4.  
  5. type AbilityParams = Record<string, number>
  6.  
  7. export default class PaymentModuleAbility extends UIAbility {
  8.   onCreate(want, launchParam) {
  9.     const params = want.parameters as AbilityParams;
  10.     AppStorage.SetOrCreate<number>("orderId", params.orderId);
  11.     hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');
  12.   }
  13.  
  14.   onDestroy() {
  15.     hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onDestroy');
  16.   }
  17.  
  18.   onWindowStageCreate(windowStage: window.WindowStage) {
  19.     // Main window is created, set main page for this ability
  20.     hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');
  21.  
  22.     windowStage.loadContent('pages/Index', (err, data) => {
  23.       if (err.code) {
  24.         hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
  25.         return;
  26.       }
  27.       hilog.info(0x0000, 'testTag', 'Succeeded in loading the content. Data: %{public}s', JSON.stringify(data) ?? '');
  28.     });
  29.   }
  30.  
  31.   onWindowStageDestroy() {
  32.     // Main window is destroyed, release UI related resources
  33.     hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageDestroy');
  34.   }
  35.  
  36.   onForeground() {
  37.     // Ability has brought to foreground
  38.     hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onForeground');
  39.   }
  40.  
  41.   onBackground() {
  42.     // Ability has back to background
  43.     hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onBackground');
  44.   }
  45. }
4.5.3 修改 paymentModule 模块的 Index.ets

从 storage 中获取 orderId

点击支付按钮， PaymentModuleAbility 停止自身并返回结果

  1. import common from '@ohos.app.ability.common'
  2.  
  3. @Entry
  4. @Component
  5. struct Index {
  6.   @State message: string = 'payment module page'
  7.   @StorageProp("orderId") orderId: number = 0
  8.  
  9.   build() {
  10.     Row() {
  11.       Column() {
  12.         Text(this.message)
  13.           .fontSize(50)
  14.           .fontWeight(FontWeight.Bold)
  15.  
  16.         Text(`${this.orderId}`)
  17.           .fontSize(50)
  18.           .fontColor(Color.Red)
  19.  
  20.         Button("支付").onClick(() => {
  21.           const context = getContext(this) as common.UIAbilityContext;
  22.           context.terminateSelfWithResult({
  23.             resultCode: 1,
  24.             want: {
  25.               deviceId: '', // deviceId为空表示本设备
  26.               bundleName: 'com.example.myapplications',
  27.               abilityName: 'EntryAbility',
  28.               moduleName: 'entry',
  29.               parameters: {
  30.                 isPay: true
  31.               }
  32.             }
  33.           })
  34.         })
  35.       }
  36.       .width('100%')
  37.     }
  38.     .height('100%')
  39.   }
  40. }

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

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

  

闽ICP备14008679号