Jump to content

ArkUI

Edit links
From Wikipedia, the free encyclopedia
ArkUI
Developer(s)Huawei
Initial releaseOctober 22, 2021
Operating systemHarmonyOS,OpenHarmony,Oniro OS
TypeSoftware framework
Licenseopen source,Apache License[1]
Websitehttps://developer.harmonyos.com/en/develop/arkUI

ArkUIis adeclarativebased user interface framework for buildinguser interfacesonnativeHarmonyOS,OpenHarmonyalongside Oniro OS applications developed byHuaweifor theArkTSandCangjieprogramming language.[2]

Overview

[edit]

ArkUI 3.0 isdeclarativein eTS (extended TypeScript) in HarmonyOS 3.0, followed by main ArkTS programming language in HarmonyOS 3.1, contrasting with theimperative syntaxused inJavadevelopment 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, anddata binding.ArkUI automatically synchronizes between UI views and data.[3]

ArkUI integrates withDevEco StudioIDEto provide for real-time previews during editing, alongside support for debugging and other development features.[4]

ArkJS primarily used for web development paradigm, based on JavaScript that targets smaller and basic applications on ArkUI for web developers onJSandCSS.[5]

History

[edit]

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.[6]

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.[7]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.[8]

During HDC 2023, August 2023, Huawei announced HarmonyOS 4.0 improvements of ArkUI withArkTSalongside nativeHarmonyOS NEXTsoftware development usingArk EnginewithArkGraphics 2DandArkGraphics 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 usingDevEco StudioIDE and Visual Studio Code plugins. On January 18, 2024, during HarmonyOS Ecology Conference, Huawei revealed theHarmonyOS NEXTsoftware stack, that included ArkUI/ArkUI-X programming framework with theArk Compiler/BiSheng Compiler/Ark Runtimecompiler & runtime, for both ArkTS and incoming Cangjie programming language.[9]

ArkUI-X

[edit]
ArkUI-X
Developer(s)Huawei
Initial releaseDecember 8, 2023
Operating systemAndroid,iOS,OpenHarmony,Oniro OS,HarmonyOS,Web platform(ArkJS)
TypeApplication framework
LicenseApache License
Websitehttps://developer.harmonyos.com/en/develop/arkUI

ArkUI-X is anopen-sourceUIsoftware development kitwhich is the extension of ArkUI created by Huawei. It is used to developcross platform applicationsas an application framework from a singlecodebasefor any platform such asAndroid,iOS,OpenHarmonyand nativeHarmonyOSwithHarmonyOS NEXTsystem, includingWeb platformwith ArkJS which was released on December 8, 2023, after Canary 1 build on August 4, 2023.[10]

ArkUI-X consists of both a UI language and a rendering engine. When a ArkUI-X application is compiled, the key modules used by ArkUI, such as the core engine, graphics engine, and ArkTS runtime, are all cross-platform. The goal is to allow developers to build advanced, high-performance applications on open source OpenHarmony as foundation that can run on different OS platforms while using a single set of master code in reduced development times.[11]

Examples

[edit]

The following is an example of a simpleHello Worldprogram. It is standard practice in ArkUI to separate the application struct and views into different structs, with the main view namedIndex.[12] 

importArkTS
// Index.ets

importrouterfrom'@ohos.router';

@Entry
@Component
structIndex{
@Statemessage: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%')
}
}

See also

[edit]

References

[edit]
  1. ^"ArkUI API tham khảo".Gitee.OpenAtom OpenHarmony.Retrieved21 May2024.
  2. ^Parker, Victoria."HDC Technical Sub-forum: A comprehensive look at HarmonyOS 'next-generation UI Framework".Mo4Tech.Retrieved12 February2024.
  3. ^"2:2 Introduction to the ArkUI framework".arkui.club.© arkui.club.Retrieved12 February2024.
  4. ^Sarkar, Amy."HarmonyOS 3.0 ArkUI 3.0: Declarative User Interface framework".HC Newsroom.Retrieved12 February2024.
  5. ^Kapuściak, Kacper; Wajgelt, Juliusz; Schmidt, Stefan."Bringing Graphical Applications to Oniro on the Example of React Native".YouTube.Eclipse Foundation.Retrieved29 February2024.
  6. ^"New release of HarmonyOS 3.0.0 developer preview".SegmentFault.Retrieved12 February2024.
  7. ^Balogun, Yusuf."Huawei Enters Declarative Development with HarmonyOS 3.1 Version Announcement".techgenyz.Retrieved12 February2024.
  8. ^Sarkar, Amy."HarmonyOS 3.1 Beta 2 rolling out".HC Newsroom.Retrieved12 February2024.
  9. ^Bhati, Kamlesh."Huawei HarmonyOS NEXT Official Now: Bring Spatial Design and Vivid Color Concepts".Sparrownews.com.Retrieved12 February2024.
  10. ^"ArkUI-X Release Notes".ArkUI-X GitHub.Retrieved12 February2024.
  11. ^"ArkUI-X dự lãm bản chính thức khai nguyên".Tri hồ chuyên lan(in Chinese).Retrieved2024-05-21.
  12. ^"Getting Started with ArkTS in Stage Model - Implementing Page Redirection".HarmonyOS.Retrieved12 February2024.
[edit]
Retrieved from "https://en.wikipedia.org/w/index.php?title=ArkUI&oldid=1235471423"