写点什么

基于 OpenHarmony 的 ArkUI 框架进阶对于高性能容器类和持久化和原子化的运用

作者:黎燃
  • 2022-11-23
    内蒙古
  • 本文字数:2817 字

    阅读完需:约 9 分钟

高性能容器类

顾名思义,容器类是一个存储类,用于存储各种数据类型的元素,并提供一系列处理数据元素的方法。ArkUI 开发框架提供了两种类型的容器类,线性和非线性。这些容器类是用类似的静态语言实现的。


declare class List<T> {
constructor(); length: number; add(element: T): boolean; get(index: number): T; has(element: T): boolean; getIndexOf(element: T): number; removeByIndex(index: number): T; remove(element: T): boolean; getLastIndexOf(element: T): number; forEach(callbackfn: (value: T, index?: number, List?: List<T>) => void, thisArg?: Object): void; convertToArray(): Array<T>; isEmpty(): boolean; [Symbol.iterator](): IterableIterator<T>; // 省略部分API }
复制代码


它们通过限制存储位置和属性、确保对数据的有效访问和提高应用程序的性能,使每种类型的数据能够在完成其自身功能的基础上切断冗余分支。本章将介绍 ArkUI 开发框架中的各种类型的容器类以及相关 API 的使用。


ArrayList 是一个动态数组,可用于构造全局数组对象。根据通用定义,ArrayList 要求存储位置是一个连续的内存空间,初始容量为 10,并支持动态扩展。每次扩建是原容量的 1.5 倍。添加、删除、修改和查询 ArrayList 的相关 API 如下:


declare class ArrayList<T> {
constructor(); length: number; add(element: T): boolean; insert(element: T, index: number): void; has(element: T): boolean; getIndexOf(element: T): number; removeByIndex(index: number): T; remove(element: T): boolean; getLastIndexOf(element: T): number; removeByRange(fromIndex: number, toIndex: number): void; replaceAllElements(callbackfn: (value: T, index?: number, arrlist?: ArrayList<T>) => T, thisArg?: Object): void; forEach(callbackfn: (value: T, index?: number, arrlist?: ArrayList<T>) => void, thisArg?: Object): void; sort(comparator?: (firstValue: T, secondValue: T) => number): void; clear(): void; isEmpty(): boolean; // 省略部分API}
复制代码

Badge

interface BadgeInterface {  (value: BadgeParamWithNumber): BadgeAttribute;  (value: BadgeParamWithString): BadgeAttribute;}
declare interface BadgeParam { position?: BadgePosition; style: BadgeStyle;}
declare interface BadgeParamWithNumber extends BadgeParam { count: number; maxCount?: number;}
declare interface BadgeParamWithString extends BadgeParam { value: string;}
declare interface BadgeParam { position?: BadgePosition; style: BadgeStyle;}
复制代码


Badge 的构造方法允许接收 BadgeParamWithNumber 和 BadgeParameWithString 参数,这两个参数都是从 BadgeParam 继承的。BadgeParam 参数描述如下:位置:设置徽章的显示位置。BadgePosition 提供以下三个位置:右:徽章显示在右垂直中心。RightTop(默认):徽章显示在右上角。左:徽章显示在左垂直中心。样式:设置徽章的显示样式。BadgeStyle 参数描述如下:颜色:设置徽章的文本颜色,默认为白色。FontSize:设置徽章的文本字体大小。默认值为 10 vp。BadgeSize:设置徽章的显示大小。徽章颜色:设置徽章的背景颜色,默认为红色。

原子化服务代码简析

创建原子化服务项目后,系统将默认在条目的 js 目录和 FormAbility 目录中生成页面模板和服务管理。页面模板是一种标准的原子化卡片布局,页面表示页面集,索引表示特定模块。服务管理为服务状态更改提供回调,在该回调中可以更新卡数据。


<div class="container">    <stack>                                                  // 堆叠式布局        <div class="container-img">            <image src="/common/widget.png" class="bg-img"/> // 设备卡片背景        </div>        <div class="container-inner">            <text class="title">                             // 设置标题                {{ $t('strings.title_immersive') }}            </text>            <text class="detail_text" onclick="routerEvent"> // 设备内容,点击时触发routerEvent事件                {{ $t('strings.detail_immersive') }}            </text>        </div>    </stack></div>
复制代码


类将 onclick 事件添加到“detail_text”的文本组件。单击组件时,触发 routerEvent 的事件回调。RouterEvent 在 index 中布局代码在 json 文件中配置,演示效果如下:


表达式持久化

'@ohos.data.存储模块提供的存储接口有存储数据的要求,用户的计算数据很大,因此将计算表达式数据存储在数据库中是合适的。ArkUI 开发框架可在“@ohos”上获得。data rdb'模块提供了一套完整的接口,用于基于 SQLite 组件 RdbStore 管理本地数据库,它提供了一系列用于添加、删除、修改和查询的方法,并支持运行 SQL 语句以满足复杂场景的需要。创建 ExpressionManager 类,该类负责添加、删除、修改和查询 Expression 数据。代码如下:


let DB_NAME = "calculator.db";let TB_NAME = "calculator_expression";let COL_ID = "id";let COL_OD = "ownerId";let COL_EP = "expression";let COL_RT = "result";let COL_CM = "comment";let COL_TM = "time";let DB_CONFIG = { name: DB_NAME };let CREATE_TABLE = "CREATE TABLE IF NOT EXISTS " + TB_NAME + " ( " +                      COL_ID + " INTEGER PRIMARY KEY AUTOINCREMENT, " +                      COL_OD + " INTEGER, " +                      COL_EP + " TEXT, " +                      COL_RT + " INTEGER, " +                      COL_CM + " TEXT, " +                      COL_TM + " INTEGER" +                   ")";
export class ExpressionManager {
public static init() { ExpressionManager.get().initDB(); }
public static get() { if(null == INSTANCE) { INSTANCE = new ExpressionManager(); } return INSTANCE; }
private rdbStore: rdb.RdbStore;
private constructor() { }
// 删除Expression public deleteExpression(expression: Expression) { if(expression && this.rdbStore) { var sql = "delete from " + TB_NAME + " where " + COL_ID + " = " + expression.id; this.rdbStore.executeSql(sql, null, (error, result) => { if(error) { Logger.log(JSON.stringify(error)); } }); } }
复制代码


ExpressionManager 提供添加、删除、修改和查询表达式等操作。它在内部缓存 RdbStore 实例,以便于后续修改表达式。因此,需要在 APP 启动时初始化 ExpressionManager,当 APP 启动 ets 的 onCreate()方法时,

发布于: 刚刚阅读数: 3
用户头像

黎燃

关注

前端工程师 2022-05-06 加入

专注学习分享前端知识。

评论

发布
暂无评论
基于OpenHarmony的ArkUI框架进阶对于高性能容器类和持久化和原子化的运用_前端_黎燃_InfoQ写作社区