【OpenHarmony】ArkTS 语法基础 ③ ( @Component 自定义组件生命周期回调函数 | @Entry 页面生命周期回调函数 )

文章目录

  • 一、ArkTS @Component 自定义组件生命周期
    • 1、自定义组件生命周期
    • 2、aboutToAppear 函数执行时机和作用
    • 3、aboutToDisappear 函数执行时机和作用
    • 4、代码示例
  • 二、ArkTS @Entry 页面生命周期
    • 1、@Entry 页面生命周期
    • 2、onBackPress 和 onPageHide 回调函数无关联
  • 三、代码示例 - @Entry 页面生命周期 + @Component 自定义组件生命周期
    • 1、代码示例 - @Component 自定义组件生命周期
    • 2、代码示例 - @Entry 页面生命周期
    • 3、进入页面后的效果
    • 4、屏幕熄灭
    • 5、屏幕点亮
    • 6、按下 Home 键
    • 7、Home 键返回
    • 8、回退键退出应用



在这里插入图片描述


参考文档 : <HarmonyOS第一课>ArkTS开发语言介绍





一、ArkTS @Component 自定义组件生命周期




1、自定义组件生命周期


ArkTS 的 @Component 自定义组件 生命周期 从创建 到 销毁的全过程 , 如下图所示 :

在这里插入图片描述

  • 首先 , 创建 自定义组件 ;
  • 然后 , 在将要显示到页面上时 , 回调 自定义组件 的 aboutToAppear() 函数 ;
  • 再后 , 显示完毕将要在页面上消失时 , 回调 自定义组件 的 aboutToDisappear() 函数 ;
  • 最后 , 销毁 自定义组件 ;

2、aboutToAppear 函数执行时机和作用


aboutToAppear() 函数 在 创建自定义组件 之后 , 在 build() 声明 UI 函数 之前执行 ;

aboutToAppear() 函数 中 通常 用于 初始化 将要在 UI 中展示的数据 , 或 申请 系统资源 , 在后续执行的 build 函数中 , 使用 初始化的数据 或 申请的系统资源 ;


3、aboutToDisappear 函数执行时机和作用


aboutToDisappear() 函数 在 build() 声明 UI 函数 之后 , 在 自定义组件销毁 之前 , 进行调用 ;

aboutToAppear() 函数 中 通常 用于 销毁 在 UI 中展示的数据 , 或 释放不再申请的 系统资源 ;


4、代码示例


在自定义组件 MyComponent 中 , 重写 aboutToAppear 和 aboutToDisappear 函数 , 然后在页面中使用该自定义组件 ;

import hilog from '@ohos.hilog'@Component
export struct MyComponent {// 创建后 , build 之前回调aboutToAppear(){console.log("aboutToAppear")}// 自定义子组件build() {Column({ space: 20 }) { // 设置子组件间距为10Text('Text1').fontSize(20).backgroundColor(Color.Green)Text('Text2').fontSize(20).backgroundColor(Color.Yellow)Text('Text3').fontSize(20).backgroundColor(Color.Gray)}.width('50%') // 设置 Row 的宽度.height('50%') // 设置 Row 的高度.backgroundColor(Color.Pink).alignItems(HorizontalAlign.Center) // 水平居中.justifyContent(FlexAlign.Center) // 垂直居中}// build 之后 , 销毁前回调aboutToDisappear() {console.log("aboutToDisappear")}
}

在页面中 , 使用该自定义组件 :

// 导入外部自定义子组件
import {MyComponent} from '../view/MyComponent';@Entry
@Component
struct Example {build() {// 必须使用布局组件包括子组件Column(){// 自定义子组件MyComponent();}}
}

运行效果 :

在这里插入图片描述

上述代码在本博客资源中可以下载 ;





二、ArkTS @Entry 页面生命周期




1、@Entry 页面生命周期


使用 @Entry 修饰自定义组件 , 就是将该自定义组件设置为 默认页面入口 ;

页面入口组件 , 会在 自定义组件 的 生命周期回调函数

  • aboutToAppear() 函数 : 自定义组件创建后 , 调用 build 函数之前 , 回调该函数 ;
  • aboutToDisappear() 函数 : 自定义组件 调用 build 函数显示 之后 , 销毁之前 , 回调该函数 ;

的 基础上 , 额外提供了另外 3 个生命周期函数 :

  • onPageShow() 函数 : 进入该界面时 , 应用进入前台时 , 页面显示 , 回调该函数 ;
  • onBackPress() 函数 : 用户点击 回退键 , 回调该函数 ;
    • 注意 : 此时不会 回调 onPageHide 函数 ;
  • onPageHide() 函数 : 用户点击 Hone 键 , 页面进入后台 , 页面隐藏 , 回调该函数 ;
    • 注意 : 此时不会 回调 onBackPress 函数 ;

2、onBackPress 和 onPageHide 回调函数无关联


下图是 HarmonyOS 官方教程中的图 , onBackPress 和 onPageHide 函数的回调 , 经测试没有先后关系 , 是两种不同操作 对应的 不同的回调 ;

  • 只有在用户点击回退键时 , 才会回调 onBackPress 函数 ;
  • 只有在用户点击 Home 键或界面进入后台时 , 才会回调 onPageHide 函数 ;

在这里插入图片描述





三、代码示例 - @Entry 页面生命周期 + @Component 自定义组件生命周期




1、代码示例 - @Component 自定义组件生命周期


自定义组件代码示例 :

import hilog from '@ohos.hilog'@Component
export struct MyComponent {// 创建后 , build 之前回调aboutToAppear(){console.log("HSL MyComponent aboutToAppear")}// 自定义子组件build() {Column({ space: 20 }) { // 设置子组件间距为10Text('Text1').fontSize(20).backgroundColor(Color.Green)Text('Text2').fontSize(20).backgroundColor(Color.Yellow)Text('Text3').fontSize(20).backgroundColor(Color.Gray)}.width('50%') // 设置 Row 的宽度.height('50%') // 设置 Row 的高度.backgroundColor(Color.Pink).alignItems(HorizontalAlign.Center) // 水平居中.justifyContent(FlexAlign.Center) // 垂直居中}// build 之后 , 销毁前回调aboutToDisappear() {console.log("HSL MyComponent aboutToDisappear")}
}

2、代码示例 - @Entry 页面生命周期


页面代码示例 :

// 导入外部自定义子组件
import {MyComponent} from '../view/MyComponent';@Entry
@Component
struct Example {aboutToAppear(){console.log("HSL Example aboutToAppear")}onPageShow() {console.log("HSL Example onPageShow")}onBackPress() {console.log("HSL Example onBackPress")}build() {// 必须使用布局组件包括子组件Column(){// 自定义子组件MyComponent();}}onPageHide() {console.log("HSL Example onPageHide")}aboutToDisappear(){console.log("HSL Example aboutToDisappear")}}

3、进入页面后的效果


这里使用真机进行调试 , 进入页面后会打印如下日志 :

 I  HSL Example aboutToAppearI  HSL MyComponent aboutToAppearI  HSL Example onPageShow

先回调 页面组件 Example 的 aboutToAppear 函数 ,

然后回调了 自定义组件 MyComponent 的 aboutToAppear 函数 ,

最后 回调了 页面组件 Example 的 onPageShow 函数 ;

在这里插入图片描述


4、屏幕熄灭


写博客的时候 , 屏幕屏保激活 , 手机息屏了 , 此时会回调 页面组件 Example 的 onPageHide 函数 ;

 I  HSL Example onPageHide

在这里插入图片描述


5、屏幕点亮


再次解锁点亮屏幕 , 回调 页面组件 Example 的 onPageShow 函数 ;

 I  HSL Example onPageShow

在这里插入图片描述


6、按下 Home 键


按下 Home 键 , 应用页面进入后台 , 此时显示 Launcher 主界面 , 回调 页面组件 Example 的 onPageHide 函数 ;

 I  HSL Example onPageHide

在这里插入图片描述


7、Home 键返回


在 后台 应用 中查找该应用 , 将应用设置到前台 , 此时会 回调 页面组件 onPageShow 的 onPageShow 函数 ;

 I  HSL Example onPageShow

在这里插入图片描述


8、回退键退出应用


点击回退键 , 退出应用 , 此时会回调 Example 页面的 onBackPress 函数 / onPageHide 函数 / aboutToDisappear 函数 , 然后回调 MyComponent 自定义组件的 aboutToDisappear 函数 ;

 I  HSL Example onBackPressI  HSL Example onPageHideI  HSL Example aboutToDisappearI  HSL MyComponent aboutToDisappear

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/22166.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

文化若想挣钱,真的很可怕吗?

文化若想挣钱&#xff0c;真的很可怕吗&#xff1f; 近日&#xff0c;我看到受人尊敬的静思有我先生的一个音频作品《会挣钱&#xff0c;遇上有文化&#xff0c;这个地方很可怕》&#xff0c;把这个标题在网上搜一搜&#xff0c;在它下面就跟着有这样一篇文章--商人不可怕&…

vscode 1.85安装remote-ssh后左侧没有图标

vscode安装remote-ssh插件后左侧没有图标。 解决方法 想要左侧有图标&#xff0c;是另一个插件起作用&#xff1a;Remote Explorer 但是这个插件最新版需要1.87&#xff0c;可以switch to Pre-release version之后就能用了。 其实&#xff0c;最后再switch to Release Versio…

动静态库【Linux】

文章目录 静态库的打包动态库的打包 静态库的打包 把我们提供的方法&#xff0c;给别人用: 1、把源文件直接给别人 2、把源代码打包成库库.h 例如 &#xff1b;有a.c b.c c.c d.c ,四个.c文件 &#xff0c; 将a.c 形成a.o ,b.c形成b.o c.c形成c.o d.c形成d.o文件&#xff0c;…

【前端Vue3】——JQuery知识点总结(超详细)

&#x1f3bc;个人主页&#xff1a;【Y小夜】 &#x1f60e;作者简介&#xff1a;一位双非学校的大二学生&#xff0c;编程爱好者&#xff0c; 专注于基础和实战分享&#xff0c;欢迎私信咨询&#xff01; &#x1f386;入门知识专栏&#xff1a;&#x1f387;【MySQL&#…

【力扣刷题 动态规划】LeetCode 139 单词拆分、LeetCode 300 最长递增子序列 ✌

文章目录 1. 单词拆分2. 最长递增子序列 1. 单词拆分 题目链接 &#x1f34e; 解题思路&#xff1a; class Solution {bool dp[310] {false};public:bool wordBreak(string s, vector<string>& wordDict) {unordered_set<string> myset;for(auto& str :…

《欢乐钓鱼大师》新手攻略大全!新手逆袭之路!

《欢乐钓鱼大师》是一款趣味十足的模拟钓鱼游戏&#xff0c;适合各类玩家&#xff0c;从钓鱼新手到钓鱼高手都能在游戏中找到乐趣。为了帮助新手玩家更快地掌握游戏技巧&#xff0c;提高钓鱼水平&#xff0c;我们准备了一些实用的攻略和技巧&#xff0c;帮助大家轻松入门&#…

PDF 文件的解析

1、文本 PDF 的解析 1.1、文本的提取 进行文本提取的 Python 库包括&#xff1a;pdfminer.six、PyMuPDF、PyPDF2 和 pdfplumber&#xff0c;效果最好的是 PyMuPDF&#xff0c;PyMuPDF 在进行文本提取时能够最大限度地保留 PDF 的阅读顺序&#xff0c;这对于双栏 PDF 文件的抽…

MyBatis3.4全集笔记

MyBatis 1. MyBatis 简介 MyBatis 本是apache的一个开源项目iBatis, 2010年这个项目由apache software foundation 迁移到了google code&#xff0c;并且改名为MyBatis 。2013年11月迁移到Github。 iBATIS一词来源于“internet”和“abatis”的组合&#xff0c;是一个基于Ja…

SpringSecurity6从入门到实战之SpringSecurity整合自动装配详解(源码级讲解,耐心看完)

SpringSecurity6从入门到实战之SpringSecurity整合自动装配详解 这里我先引出问题然后再来一步步进行剖析,SpringSecurity到底是如何实现引入依赖后所有请求都需要进行认证并且会弹出login登录表单页面. 接下来会对SpringBoot的自动装配进行详解,SpringSecurity也是通过自动装配…

AI绘画Stable Diffusion 制作幻术光影字:使用Brightness亮度控制模型,超简单!

大家好&#xff0c;我是灵魂画师向阳。 今天给大家分享的教程是利用AI工具Stable Diffusion 制作光影文字。这是一种通过模拟自然光线照射和阴影效果&#xff0c;使文字看起来具有立体感和逼真感的设计风格。 它的主要目的是让文字自然的融合在场景中。 先来看组实例图。 …

【机器学习数据挖掘】基于ARIMA 自回归积分滑动平均模型的销售价格库存分析报告 附完整python代码

资源地址&#xff1a;Python数据分析大作业 4000字 图文分析文档 销售分析 完整python代码 ​ 完整代码分析 同时销售量后1000的sku品类占比中&#xff08;不畅销产品&#xff09;如上&#xff0c;精品类产品占比第一&#xff0c;达到66.7%&#xff0c;其次是香化类产品&#…

【赠书活动】好书推荐—《详解51种企业应用架构模式》

导读&#xff1a; 企业应用包括哪些&#xff1f;它们又分别有哪些架构模式&#xff1f;世界著名软件开发大师Martin Fowler给你答案。 01 什么是企业应用 我的职业生涯专注于企业应用&#xff0c;因此&#xff0c;这里所谈及的模式也都是关于企业应用的。&#xff08;企业应用…

逐步掌握最佳Ai Agents框架-AutoGen 八 开源模型

前言 本篇文章&#xff0c;我们来探索下AutoGen使用其它LLM大模型。主要原因是AutoGen在使用chatgpt3.5/chatgpt 4等付费模型时&#xff0c;token开销比较大。如果我们的业务&#xff0c;社区里的开源模型就能搞定&#xff0c;那当然就开冲了。 接下来就让我们看下&#xff0…

书籍《钱从哪里来5:微利社会》观后感

样例 前几周看完了这本书&#xff0c;《钱从哪里来5&#xff1a;微利社会》&#xff0c;这应该算是&#xff0c;作者香帅在“得到”出的第5本书了。个人来看&#xff0c;或者说尽自己而言&#xff0c;现在并不是对财理相关话题&#xff0c;有很大兴趣&#xff0c;只是在跨年的时…

有哪些好用的ai工具,可以提升科研、学习、办公等效率?

最近&#xff0c;Sora的诞生为AI再添了一把火。 据介绍&#xff0c;这款“文生视频”的Sora可以直接输出长达60秒的视频&#xff0c;并且包含高度细致的背景、复杂的多角度镜头&#xff0c;以及富有情感的多个角色。 不仅能准确呈现细节&#xff0c;还能理解物体在物理世界中…

指针的认识(野指针、规避野指针、assert宏断言)

目录 a.野指针成因 1.指针未初始化 2.指针越界访问 3.指针指向的空间释放 b.规避野指针 1.指针初始化 2.小心指针越界 3.指针变量不再使用时&#xff0c;及时置NULL&#xff0c;指针使用之前检查有效性 4.避免返回局部变量的地址 c.assert宏断言的使用 概念&#xff1…

容器化部署Pig微服务快速开发框架

系统说明 基于 Spring Cloud 、Spring Boot、 OAuth2 的 RBAC 企业快速开发平台&#xff0c; 同时支持微服务架构和单体架构 提供对 Spring Authorization Server 生产级实践&#xff0c;支持多种安全授权模式 提供对常见容器化方案支持 Kubernetes、Rancher2 、Kubesphere、E…

适合小白学习的项目1901java体育馆管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 java体育馆管理系统 是一套完善的web设计系统&#xff0c;对理解JSP java编程开发语言有帮助采用了java设计&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统采用web模式&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,Myeclipse8.5开发&am…

【STL深入浅出】之string类的简单模拟实现

&#x1f4c3;博客主页&#xff1a; 小镇敲码人 &#x1f49a;代码仓库&#xff0c;欢迎访问 &#x1f680; 欢迎关注&#xff1a;&#x1f44d;点赞 &#x1f442;&#x1f3fd;留言 &#x1f60d;收藏 &#x1f30f; 任尔江湖满血骨&#xff0c;我自踏雪寻梅香。 万千浮云遮碧…

“慢公司”小红书,加速布局大模型

自成立至今&#xff0c;小红书一直保持低调并被形容为“慢公司”&#xff0c;而这也反映在大模型相关产品线上。尽管上线了多项功能和应用&#xff0c;存在感却稍显不足。 进入2024年&#xff0c;小红书在大模型领域的探索悄然加速&#xff0c;持续引发市场关注度。 多方消息…