HarmonyOS 鸿蒙Next ArkTS语言教程入门学习第46天,开发基于JS UI的卡片。

发布于 1周前 作者 eggper 来自 鸿蒙OS

HarmonyOS 鸿蒙Next ArkTS语言教程入门学习第46天,开发基于JS UI的卡片。

1、AbilityStage组件容器

AbilityStage是一个Module级别的组件容器,应用的HAP在首次加载时会创建一个AbilityStage实例,可以对该Module进行初始化等操作。

AbilityStage与Module一一对应,即一个Module拥有一个AbilityStage。

DevEco Studio默认工程中未自动生成AbilityStage,如需要使用AbilityStage的能力,可以手动新建一个AbilityStage文件,具体步骤如下。

  1. 在工程Module对应的ets目录下,右键选择“New > Directory”,新建一个目录并命名为myabilitystage。
  2. 在myabilitystage目录,右键选择“New > TypeScript File”,新建一个TypeScript文件并命名为MyAbilityStage.ts。
  3. 打开MyAbilityStage.ts文件,导入AbilityStage的依赖包,自定义类继承AbilityStage并加上需要的生命周期回调,示例中增加了一个onCreate()生命周期回调。
import { AbilityStage } from '@ohos.app.ability.AbilityStage';

export default class MyAbilityStage extends AbilityStage {
  onCreate() {
    // 应用的HAP在首次加载的时,为该Module初始化操作
  }
  onAcceptWant(want) {
    // 仅specified模式下触发
    return "MyAbilityStage";
  }
}

module.json5配置文件中,通过配置srcEntry参数来指定模块对应的代码路径,以作为HAP加载的入口。

{
  "module": {
    "name": "entry",
    "type": "entry",
    "srcEntry": "./ets/myabilitystage/MyAbilityStage.ts",
    ...
  }
}

AbilityStage拥有onCreate()生命周期回调和onAcceptWant()onConfigurationUpdated()onMemoryLevel()事件回调。

  • onCreate()生命周期回调:在开始加载对应Module的第一个UIAbility实例之前会先创建AbilityStage,并在AbilityStage创建完成之后执行其onCreate()生命周期回调。AbilityStage模块提供在Module加载的时候,通知开发者,可以在此进行该Module的初始化(如资源预加载,线程创建等)能力。
  • onAcceptWant()事件回调:UIAbility指定实例模式(specified)启动时候触发的事件回调,具体使用请参见UIAbility启动模式综述
  • onConfigurationUpdated()事件回调:当系统全局配置发生变更时触发的事件,系统语言、深浅色等,配置项目前均定义在Configuration类中。
  • onMemoryLevel()事件回调:当系统调整内存时触发的事件。

应用被切换到后台时,系统会将在后台的应用保留在缓存中。即使应用处于缓存中,也会影响系统整体性能。当系统资源不足时,系统会通过多种方式从应用中回收内存,必要时会完全停止应用,从而释放内存用于执行关键任务。为了进一步保持系统内存的平衡,避免系统停止用户的应用进程,可以在AbilityStage中的onMemoryLevel()生命周期回调中订阅系统内存的变化情况,释放不必要的资源。

import { AbilityStage } from '@ohos.app.ability.AbilityStage';

export default class MyAbilityStage extends AbilityStage {
    onMemoryLevel(level) {
        // 根据系统可用内存的变化情况,释放不必要的内存
    }
}

更多关于HarmonyOS 鸿蒙Next ArkTS语言教程入门学习第46天,开发基于JS UI的卡片。的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

在HarmonyOS(鸿蒙)中,ArkTS是TypeScript的超集,专为鸿蒙系统设计。第46天的教程主题是开发基于JS UI的卡片。JS UI是鸿蒙提供的一种轻量级UI框架,适用于开发卡片等小型界面。

  1. JS UI框架:JS UI框架允许开发者使用JavaScript或TypeScript来构建用户界面。卡片是鸿蒙系统中的一种轻量级组件,通常用于展示简洁的信息或快速操作。

  2. ArkTS与JS UI结合:ArkTS通过提供类型安全和更丰富的语言特性,增强了JS UI的开发体验。开发者可以使用ArkTS来编写更健壮和可维护的卡片代码。

  3. 卡片开发步骤

    • 创建项目:在DevEco Studio中创建一个新的JS UI项目。
    • 定义卡片布局:使用XML或JS DSL(Domain Specific Language)定义卡片的布局结构。
    • 编写业务逻辑:在ArkTS中编写卡片的业务逻辑,处理用户交互和数据更新。
    • 调试与测试:通过模拟器或真机调试卡片功能,确保其在不同设备上的兼容性。
  4. 卡片生命周期:鸿蒙系统管理卡片的生命周期,包括创建、显示、隐藏和销毁。开发者可以通过重写生命周期方法来自定义卡片的行为。

  5. 数据绑定与更新:ArkTS支持数据绑定,可以将数据模型与UI元素关联,实现数据的自动更新。

  6. 发布与部署:完成开发后,将卡片打包并发布到鸿蒙应用市场,供用户下载和使用。

通过以上步骤,开发者可以基于ArkTS和JS UI框架,高效地开发出功能丰富、性能优越的鸿蒙卡片应用。

更多关于HarmonyOS 鸿蒙Next ArkTS语言教程入门学习第46天,开发基于JS UI的卡片。的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在第46天的HarmonyOS鸿蒙Next ArkTS语言教程中,您将学习如何开发基于JS UI的卡片。卡片是一种轻量级的UI组件,常用于展示简洁信息。首先,创建卡片配置文件config.json,定义卡片的样式和布局。接着,在index.hml中使用HTML-like语法编写卡片的结构,并通过index.css设置样式。最后,在index.js中实现卡片的交互逻辑,如数据绑定和事件处理。通过这些步骤,您可以快速开发出功能丰富且美观的卡片组件。

回到顶部
AI 助手
你好,我是IT营的 AI 助手
您可以尝试点击下方的快捷入口开启体验!