从零开始开发纯血鸿蒙应用之自定义构建函数

news/2025/2/2 22:21:58/

从零开始开发纯血鸿蒙应用

  • 一、前言
  • 二、系统性认识`@Builder`和`@BuilderParam`
  • 三、改造 PageTitleBar
  • 四、总结

一、前言

上个周末,由于身体抱恙,故而没有更新博文,而昨天,在返乡路途上,所以,只能拖到今天才进行博文的更新。

言归正传,开发纯血鸿蒙应用所使用的ArkTS,是一门典型的支持函数式编程的语言,页面的结构、样式以及响应逻辑,都可以使用函数去描述。在之前,我们先后接触了不少使用函数参数的代码,比如将具体的响应逻辑载入到自定义组件中。

实际上,在鸿蒙框架里面,不仅是纯逻辑的代码支持通过函数参数传递,一些页面内容也支持通过函数参数进行传递,例如,鸿蒙组件的 bindMenu 属性就接受一个菜单构建器——描述菜单具体内容和样式、结构、响应逻辑的特殊函数:
在这里插入图片描述
那么,类而用之,我们自己封装的自定义组件中,能不能做到支持使用函数参数从外部获得内容构建器呢?答案是可以的,具体如何实现,请继续跟着下文了解。

二、系统性认识@Builder@BuilderParam

看到这两个装饰器,大家应该立马想到在每个自定义组件中都必须有的 build 方法。在鸿蒙框架中,描述 UI 的代码和描述纯逻辑的代码,有着严格的区分。在 build 方法里面,可以直接使用各种实现定义好的鸿蒙组件或自定义组件,但在未特殊声明的其他成员方法体、如生命周期函数中,UI描述代码是不被允许使用的。

然而,现实需求又是存在的,即并不是所有的 UI 实现都适合用组件级别的结构进行封装,像一些描述页面局部的UI、如一个 Tip,需要更为轻量级的实现体来承担,故而,鸿蒙框架提供了 @Builder 装饰器,来将普通的成员方法转换成描述UI的自定义构建函数
在这里插入图片描述
既然允许开发者声明和定义自定义构建函数,那么衍生出来的需求必然有:将自定义构建函数传入到子组件或另一个组件中进行使用,而普通的函数参数的声明,无法被编译器识别成 UI 描述,所以,就提供了与 @Builder 装饰器配合使用的 @BuilderParam:

在这里插入图片描述
当函数参数使用了 @BuilderParam 装饰后,它就只能接受一个用 @Builder 装饰的函数,否则就会报错。

利用 @BuilderParam 参数从外部获取的 UI 实现,既可以直接在 build 方法中使用,也可以继续往 bindMenu 等鸿蒙组件的属性方法中透传,我这里便是第二种用途:

在这里插入图片描述

三、改造 PageTitleBar

之前封装了一个 PageTitleBar 用做页面标题栏,并且,里面预留了右上角菜单的位置。在之前的代码中,这个右上角菜单对点击动作的响应,是通过 onClick 函数完成的,这一次,要改为用 bindMenu 方法,也就是变成如上图的代码。

这一步改造,是考虑到不同页面的右上角菜单,必然功能不同,例如在编辑页面的右上角菜单里,可以有分享等功能,却不适合有进入编辑的功能,毕竟已经在编辑状态了。由于 PageTitleBar 实现代码发生了变化,那么,使用它的地方也要相应变化:

在这里插入图片描述
当然了,这里只是一个示例,因为我仍然还没考虑好各个页面的右上角菜单应该有什么功能。

四、总结

@Builder 装饰器的存在,让 UI 实现的灵活度,得到进一步的提高,像一些在某个自定义组件内重复度较高的 UI 代码,我们可以利用自定义构建函数进行抽取,从而降低代码冗余。

自定义构建函数,是由普通函数升格而来,也就自然而然地支持函数参数:
在这里插入图片描述
具体怎么使用,可以根据实际情况决定,我这里主要提醒大家在开发鸿蒙应用的过程中,别因为使用频率的缘故,忽略了鸿蒙框架中的一些好用的 API。


http://www.ppmy.cn/news/1568801.html

相关文章

可被electron等调用的Qt截图-录屏工具【源码开放】

1. 工具功能简介: (1)、QT5.15.2截图工具(exe)可单独使用或嵌入IM(嵌入方法参照:https://gitee.com/lykiao/yfscreenshot_release) (2)、支持通过Windows消息通知截图成功或取消 (3)、支持圆形、矩形、线条…

第25节课:前端缓存策略—提升网页性能与用户体验

目录 前端缓存的重要性HTTP缓存HTTP缓存的基本原理常见的HTTP缓存头Cache-ControlExpiresETagLast-Modified HTTP缓存的类型强缓存协商缓存 服务端渲染与SSR服务端渲染(SSR)简介SSR的优势SSR的挑战实践:使用SSR框架构建Web应用Next.js安装Nex…

Kafka常见问题之 java.io.IOException: Disk error when trying to write to log

文章目录 Kafka常见问题之 java.io.IOException: Disk error when trying to write to log1. 问题概述2. 问题排查方向(1)磁盘空间不足(2)磁盘 I/O 故障(3)Kafka 日志文件损坏(4)Kaf…

360嵌入式开发面试题及参考答案

解释一下 802.11ax 和 802.11ac/n 有什么区别 速度与带宽 802.11n 支持的最高理论速率为 600Mbps,802.11ac 进一步提升,单流最高可达 866.7Mbps,多流情况下能达到更高,如 1.3Gbps 等。而 802.11ax(Wi-Fi 6)引入了更多先进技术,理论最高速率可达 9.6Gbps,相比前两者有大…

2025年01月25日Github流行趋势

项目名称:it-tools 项目地址url:https://github.com/CorentinTh/it-tools项目语言:Vue历史star数:25298今日star数:212项目维护者:CorentinTh, apps/renovate, cgoIT, sharevb, marvin-j97项目简介&#xf…

Excel分区间统计分析(等步长、不等步长、多维度)

在数据分析过程中,可能会需要统计不同数据区间的人数、某个数据区间的平均值或者进行分组区间统计,本文从excel函数到数据透视表的方法,从简单需求到复杂需求,采用不同的方法进行讲解,尤其是通过数据透视表的强大功能大…

jvm - GC篇

如何减慢一个对象进入老年代的速度,如何降低GC的次数 堆内存细分 年轻代(Young Generation): 新创建的对象首先被分配在年轻代中。年轻代又被进一步划分为一个Eden区和两个Survivor区(通常称为S0和S1)。…

笔记本搭配显示器

笔记本:2022款拯救者Y9000P,显卡RTX3060,分辨率2560*1600,刷新率:165Hz,无DP1.4口 显示器:2024款R27Q,27存,分辨率2560*1600,刷新率:165Hz &…