ArkUI es un marco de interfaz de usuario declarativo para crear interfaces de usuario en aplicaciones nativas de HarmonyOS , OpenHarmony y Oniro OS desarrolladas por Huawei para el lenguaje de programación ArkTS y Cangjie. [2]
ArkUI 3.0 es declarativo en eTS (Extended TypeScript) en HarmonyOS 3.0, seguido por el lenguaje de programación principal ArkTS en HarmonyOS 3.1, en contraste con la sintaxis imperativa utilizada en el desarrollo de Java en versiones anteriores de HarmonyOS en HarmonyOS 1.0 y 2.0. ArkUI permite el dibujo 2D, así como el dibujo 3D, animaciones, manejo de eventos , widgets de tarjeta de servicio y enlace de datos . ArkUI se sincroniza automáticamente entre las vistas de la interfaz de usuario y los datos. [3]
ArkUI se integra con DevEco Studio IDE para proporcionar vistas previas en tiempo real durante la edición, junto con soporte para depuración y otras funciones de desarrollo. [4]
ArkJS se utiliza principalmente para el paradigma de desarrollo web, basado en JavaScript, que apunta a aplicaciones más pequeñas y básicas en ArkUI para desarrolladores web en JS y CSS . [5]
Durante la HDC 2021 del 22 de octubre de 2021, la vista previa para desarrolladores de HarmonyOS 3.0 presentó ArkUI 3.0 para eTS, lenguajes de programación JS con ArkCompiler. En comparación con las versiones anteriores de ArkUI 1.0 y 2.0 en desarrollo imperativo con Java en versiones anteriores de HarmonyOS. [6]
Durante la HDC 2022, HarmonyOS 3.1 en noviembre de 2022, Huawei ArkUI evolucionó hacia un desarrollo declarativo completo con capacidades de interfaz de usuario declarativa, capacidad de diseño mejorada, mejora de la capacidad de los componentes y otras. En abril de 2023, la compilación Beta 1 de HarmonyOS 3.1 incluyó capacidades de dibujo 2D y 3D declarativas de ArkUI. La actualización también mejora las capacidades de gestión del diseño, los componentes y el estado de la aplicación. [7]
Durante la HDC 2023, en agosto de 2023, Huawei anunció las mejoras de HarmonyOS 4.0 de ArkUI con ArkTS junto con el desarrollo de software nativo HarmonyOS NEXT utilizando Ark Engine con ArkGraphics 2D y ArkGraphics 3D . Además, la compañía anunció una extensión multiplataforma de ArkUI llamada ArkUI-X que permitiría a los desarrolladores ejecutar aplicaciones en Android, iOS y HarmonyOS en un solo proyecto utilizando DevEco Studio IDE y complementos de Visual Studio Code. El 18 de enero de 2024, durante la Conferencia de Ecología HarmonyOS, Huawei reveló la pila de software HarmonyOS NEXT , que incluía el marco de programación ArkUI/ArkUI-X con el compilador y entorno de ejecución Ark Compiler / BiSheng Compiler / Ark Runtime, tanto para ArkTS como para el lenguaje de programación Cangjie entrante. [8]
ArkUI-X es un kit de desarrollo de software de interfaz de usuario de código abierto que es la extensión de ArkUI creado por Huawei. Se utiliza para desarrollar aplicaciones multiplataforma como un marco de aplicación a partir de una única base de código para cualquier plataforma, como Android , iOS , OpenHarmony y HarmonyOS nativo con el sistema HarmonyOS NEXT , incluida la plataforma web con ArkJS que se lanzó el 8 de diciembre de 2023, después de la compilación Canary 1 el 4 de agosto de 2023. [9]
ArkUI-X consta de un lenguaje de interfaz de usuario y un motor de renderizado. Cuando se compila una aplicación ArkUI-X, los módulos clave que utiliza ArkUI, como el motor central, el motor gráfico y el entorno de ejecución ArkTS, son todos multiplataforma. El objetivo es permitir a los desarrolladores crear aplicaciones avanzadas y de alto rendimiento sobre OpenHarmony de código abierto como base que puedan ejecutarse en diferentes plataformas de SO mientras se utiliza un único conjunto de código maestro en tiempos de desarrollo reducidos. [10]
El siguiente es un ejemplo de un programa simple de Hola Mundo . Es una práctica estándar en ArkUI separar la estructura de la aplicación y las vistas en estructuras diferentes, con la vista principal denominada Index. [11]
importar ArkTS // Index.ets importar enrutador desde '@ohos.router' ; @Entry @Component struct Index { @State mensaje : cadena = 'Hola mundo' build () { Row () { Column () { Text ( this.message ) .fontSize ( 50 ) .fontWeight ( FontWeight.Bold ) // Agrega un botón para responder a los clics del usuario. Button () { Text ( ' Next' ) . fontSize ( 30 ) .fontWeight ( FontWeight.Bold ) } . type ( ButtonType.Capsule ) .margin ( { top : 20 }) . backgroundColor ( ' #0D9FFB' ) .width('40%'). height ( ' 5 % ' ) // Vincula el evento onClick al botón Siguiente para que al hacer clic en el botón se redirija al usuario a la segunda página. .onClick ( ( ) => { router.pushUrl ( { url : ' pages / Second ' } ) }) } . width ( ' 100%' ) } . altura ( '100%' ) } }