鸿蒙系统ARKUI框架对于分布式计算和请求API的实战研究
文章目录
公共样式类属性
ArkUI开发框架提供的基本组件直接或间接继承自CommonMethod。CommonMethod中定义的属性样式属于公共样式。在本节中，作者将介绍项目类型中最常用的一些样式属性。读者还可以检查CommonMethod的源代码以了解其他样式属性。
尺寸设置
设置组件的宽度和高度。默认情况下，使用构件本身的宽度和高度。例如，字符串值“100%”可用于填充父布局。当同时设置构件的尺寸和宽度/高度时，以最后设置的值为准。
export declare class CommonMethod<T> { width(value: Length): T; height(value: Length): T; size(value: SizeOptions): T;}结果如下：
语法和生命周期
组件是OpenHarmony页面的最小显示单元。一个页面可以由多个组件组成，也可以仅由一个组件组成。这些组件可以是ArkUI开发框架附带的系统组件，例如文本、按钮等，也可以是自定义组件。在本节中，我们将简要介绍自定义组件的语法规范。
定义组件
要自定义组件，必须首先定义其名称并尝试理解其含义。例如，要定义标题栏组件，作者将其命名为TitleBar。为了让系统知道它是一个组件，您需要使用@component修饰符和struct关键字来修改它。格式为[@Component struct+Component name]，如下所示：
@Component struct TitleBar { build() { // 省略 }}@Entry @Component struct Index { build() { // 省略 }}Struct：表示TitleBar是一个结构。如果使用struct关键字，则必须实现build（）方法。否则，编译器将报告一个错误：结构需要生成函数。
@Component：表示结构TitleBar具有组件化的能力，即可以成为独立的组件。
@条目：表示当前组件是页面的总条目。它被简单地理解为页面的根节点。一个页面有并且只有一个@Entry修饰符。页面上将仅显示由@Entry修改的组件或子组件。
📢： 禁止自定义组件添加构造函数，否则编译器将报告错误
刷新组件
在使用struct关键字装饰TitleBar之后，必须实现build（）方法，该方法符合Builder构造函数接口定义，并用于定义组件的声明性UI描述。当创建组件或更新组件中的@State修饰变量时，系统将自动调用build（）方法。
@Component struct TitleBar { @State count: number = 0; build() { Flex() { Text("index:" + this.number) // …… } .width('100%') .height('100%') .backgroundColor("#aabbcc") }}再按一次，退出应用
使用第三方应用程序时，我们会遇到单击返回键提示您再次退出应用程序的情况。例如，如果您短时间不按它，您将不会退出应用程序以保留用户。接下来，我们将实现再次单击返回键以退出应用程序的示例。
根据页面生命周期的方法，当您点击返回键时，将调用onBackPress（）方法，因此判断是否是第一次点击。如果是，它将返回true并给用户一个提示。如果没有，它将判断两次点击之间的时间间隔。如果间隔小于2秒，它将直接退出APP，否则会给用户提示。此示例重用了第2章中的测试代码，如下所示：
import app from '@system.app';@Entry @Component struct Index { private lastExitTime: number = -1; // 记录点击时间 @State count: number = 0; // 状态数据 build() { Stack({alignContent: Alignment.BottomEnd}) { // 堆叠式布局 Text(this.count.toString()) // 显示文本 .fontSize(50) // 文字大小 .textAlign(TextAlign.Center) // 居中对齐 .size({width: '100%', height: '100%'}) // 控件大小 Button('+') // 显示一个+按钮 .size({width: 80, height: 80}) // 按钮大小 .fontSize(50) // 按钮文字大小 .onClick(() => { // 按钮点击事件 this.count++;// count累加，触发build()方法回调 }) .margin(50) } .width('100%') .height('100%') }
上面是自定义组件的语法规范。定制组件具有以下特征：
可组合：允许开发人员组合内置组件和其他组件，以及公共属性和方法。
可重用：可被其他组件重用，并作为不同父组件或容器中的不同实例使用；
有一个生命周期：可以在组件中配置生命周期的回调方法，用于业务逻辑处理；
数据驱动更新：可以由状态数据驱动，实现UI的自动更新。
实现请求API
定义IHttpRequest接口后，@ohos可以发出特定的网络请求。net http模块提供的API也可以由开源的第三方库实现，例如HttpClient。具体的实现可以由读者选择。作者演示了两种方法：
系统API实现
使用系统API的方法是直接使用@ohos。net http模块提供与HttpRequest相关的方法来实现网络请求（不清楚http请求的使用的读者可以阅读第12章第2节），定义HttpSystem实现类并实现IHttpRequest接口。代码如下：
import http from '@ohos.net.http';import {IHttpRequest} from "./IHttpRequest"export class HttpSystem implements IHttpRequest { // 请求具体实现类 private httpRequest: http.HttpRequest; constructor() { this.httpRequest = http.createHttp(); } public getRequest(): IHttpRequest { return this; } public doGet(url: string, options?: RequestOptions) { // 由httpRequest实现具体请求 } public doPost(url: string, options?: RequestOptions) { // 由httpRequest实现具体请求 }}三方库实现
使用三方库的方式实现，就是基于第三方网络库提供的方法实现网络请求，笔者使用 HttpClient 实现（不清楚 HttpClient 使用的读者可阅读第十二章 第 6 节 的内容），定义 HttpClient 实现类并实现 IHttpRequest 接口，代码如下所示：
import httpClient from '@ohos/httpclient'import TimeUnit from '@ohos/httpclient'import {IHttpRequest} from "./IHttpRequest"let httpClientImpl = new httpClient.HttpClient.Builder() .setConnectTimeout(15, TimeUnit.TimeUnit.SECONDS) .setReadTimeout(15, TimeUnit.TimeUnit.SECONDS) .build();export class HttpClient implements IHttpRequest { public getRequest(): IHttpRequest { return this; } public doGet(url: string, options?: RequestOptions) { // httpClientImpl具体实现请求 } public doPost(url: string, options?: RequestOptions) { // httpClientImpl具体实现请求 }}分布式计算
分布式能力是OpenHarmony操作系统的核心能力之一。目前，它只支持在统一LAN中拉取远程FA的能力。在本节中，作者简要介绍了如何在网络中的一台设备上拉取另一台设备并执行协作计算。
分布式设备管理
在Minimal Calculator的应用中，分布式设备管理包括四个部分：分布式设备搜索、分布式设备列表弹出窗口、拉取远程设备和分布式数据管理。首先，在分布式网络中搜索设备，然后将搜索到的分布式设备添加到设备列表的弹出窗口中，然后根据用户的选择拉出远程设备，最后同步数据。操作结果样式如下：
ObservedPropertySimple类结构
ArkUI开发框架提供的状态管理非常方便使用，代码量也非常简单。对于开发人员来说，简化意味着ArkUI开发框架需要在内部实现许多复杂的功能。由于篇幅原因，笔者将不介绍其他类型的国家管理实施。作者简单地整理了以下states_ mgmt目录下的状态管理类的结构图。读者可以根据结构图进行其他类型的实现分析。
