Top Qs
Timeline
Chat
Perspective
ArkUI
Declarative user interface framework From Wikipedia, the free encyclopedia
Remove ads
ArkUI is a declarative based user interface framework for building user interfaces on native HarmonyOS, OpenHarmony alongside Oniro applications developed by Huawei for the ArkTS and Cangjie programming language.[2]
 | This article was nominated for deletion. The discussion was closed on 26 November 2024 with a consensus to merge the content into the article HarmonyOS. If you find that such action has not been taken promptly, please consider assisting in the merger instead of re-nominating the article for deletion. To discuss the merger, please use the destination article's talk page. (November 2024) |
 | This article has multiple issues. Please help improve it or discuss these issues on the talk page. (Learn how and when to remove these messages)
|
Remove ads
Remove ads
Overview
ArkUI 3.0 is declarative in eTS (extended TypeScript) in HarmonyOS 3.0, followed by main ArkTS programming language in HarmonyOS 3.1, contrasting with the imperative syntax used in Java development in earlier versions of HarmonyOS in HarmonyOS 1.0 and 2.0. ArkUI allows for 2D drawing as well as 3D drawing, animations, event handling, Service Card widgets, and data binding. ArkUI automatically synchronizes between UI views and data.[3]
ArkUI integrates with DevEco Studio IDE to provide for real-time previews during editing,[4] alongside support for debugging and other development features.[5]
ArkJS is designed for web development with a Vue 2-like syntax, providing a familiar environment for web developers using JS and CSS. ArkJS incorporates the HarmonyOS Markup Language (HML), which allows attributes prefixed with @ for MVVM architectural pattern.[6][3][7]
Remove ads
History
Summarize
Perspective
During HDC 2021 on October 22, 2021, the HarmonyOS 3.0 developer preview introduced ArkUI 3.0 for eTS, JS programming languages with ArkCompiler. Compared to previous versions of ArkUI 1.0 and 2.0 under imperative development with Java in earlier versions of HarmonyOS.[8]
During HDC 2022 HarmonyOS 3.1 in November 2022, Huawei ArkUI evolved into full declarative development featuring declarative UI capabilities, improved layout ability, component capability improvement and others. In April 2023, HarmonyOS 3.1 Beta 1 build included ArkUI declarative 2D and 3D drawing capabilities. The upgrade also improves layout, component, and app state management capabilities.[9]
During HDC 2023, August 2023, Huawei announced HarmonyOS 4.0 improvements of ArkUI with ArkTS alongside native HarmonyOS NEXT software development using Ark Engine with ArkGraphics 2D and ArkGraphics 3D. Also, the company announced a cross platform extension of ArkUI called ArkUI-X which would allow developers to run applications across Android, iOS and HarmonyOS under one project using DevEco Studio IDE and Visual Studio Code plugins. On January 18, 2024, during HarmonyOS Ecology Conference, Huawei revealed the HarmonyOS NEXT software stack, that included ArkUI/ArkUI-X programming framework with the Ark Compiler/BiSheng Compiler/Ark Runtime compiler & runtime, for both ArkTS and incoming Cangjie programming language.[10]
Remove ads
ArkUI-X
ArkUI-X is an open-source UI software development kit which is the extension of ArkUI created for building cross platform applications, including Android, iOS targets additionally.[11] Web platform support with ArkJS was released on December 8, 2023.[12] ArkUI-X consists of both a UI language and a rendering engine.[13]
Features
The ArkUI architecture is divided into three layers: the top layer offers a declarative UI paradigm; the middle layer consists of the Ark Compiler and runtime, the UI backend engine, and the rendering engine; and the bottom layer serves as the platform adaptation and bridging layer.[11]
Components
System components are built-in components within the ArkUI framework, categorized into container components and basic components. For example, Row and Column are container components that can hold other components, while Text and Button are basic components.[14]
Remove ads
Examples
Summarize
Perspective
The following is an example of a simple Hello World program. It is standard practice in ArkUI to separate the application struct and views into different structs, with the main view named Index.[15]
import ArkTS
// Index.ets
import router from '@ohos.router';
@Entry
@Component
struct Index {
@State message: string = 'Hello World'
build() {
Row() {
Column() {
Text(this.message)
.fontSize(50)
.fontWeight(FontWeight.Bold)
// Add a button to respond to user clicks.
Button() {
Text('Next')
.fontSize(30)
.fontWeight(FontWeight.Bold)
}
.type(ButtonType.Capsule)
.margin({
top: 20
})
.backgroundColor('#0D9FFB')
.width('40%')
.height('5%')
// Bind the onClick event to the Next button so that clicking the button redirects the user to the second page.
.onClick(() => {
router.pushUrl({ url: 'pages/Second' })
})
}
.width('100%')
}
.height('100%')
}
}
The @ohos.router routing library implements page transitions, which must be declared in the main_pages.json file before being invoked.[16]
Remove ads
Reception
See also
References
External links
Wikiwand - on
Seamless Wikipedia browsing. On steroids.
Remove ads