Introducción a Jetpack Compose | por Snayush | Comunidad de desarrolladores y estudiantes Vishwakarma Institute of Technology, Pune | Octubre de 2021
Escritura de Jetpack, Suena genial, ¿verdad? Bueno, suena elegante, es un conjunto de herramientas de interfaz de usuario moderno diseñado para simplificar el desarrollo de la interfaz de usuario en Android. Consiste en un modelo de programación reactiva, con la sencillez y facilidad de uso del lenguaje de programación Kotlin. Es completamente declarativo, por lo que puede describir su IU llamando a algunas funciones que transforman sus datos en una jerarquía de IU. Cuando los datos se modifican o actualizan, el marco llamará automáticamente a estas funciones y actualizará la vista por usted. En este artículo, veremos algunos temas básicos que son útiles antes de comenzar a usar Jetpack Compose.
· ¿Qué es Jetpack Compose?
· ¿Cuáles son sus beneficios?
· ¿Qué desafíos se pueden resolver con Jetpack Compose?
· ¿Cómo empezamos a utilizar Jetpack Compose?
· Funciones compostables
· Diseño
· Diseño de materiales
· Listas y animaciones
· En conclusión
Menos código y más capacidades de desarrollo. Esto define perfectamente Jetpack Compose porque es un conjunto de herramientas de interfaz de usuario moderno lanzado recientemente por Google para crear una interfaz de usuario nativa de Android. Simplifica y acelera el desarrollo de la interfaz de usuario con menos código, API de Kotlin y herramientas potentes.
· declaración: Es completamente declarativo, por lo que puede describir los componentes de la interfaz de usuario llamando a algunas funciones predefinidas.
· Compatible: Es fácilmente compatible con las vistas existentes en Android.
· Mejorar la velocidad de desarrollo: En el pasado, los desarrolladores se ocupaban de archivos XML y archivos Kotlin. Pero con la ayuda de jetpack compose, se vuelve muy fácil, los desarrolladores solo necesitan lidiar con archivos Kotlin, por lo que ayudará a los desarrolladores a aumentar la velocidad de desarrollo.
· Kotlin conciso e idiomático: Jetpack Compose utiliza los beneficios de Kotlin para crear la interfaz de usuario.
· Archivos más pequeños: Porque el código base de cualquier aplicación existe en un solo archivo. Se vuelve fácil de administrar y procesar el código base de la aplicación.
· Escrito en Kotlin: Las aplicaciones escritas con jetpack compose utilizan solo el lenguaje de programación Kotlin.
· Al escribir nuestro código, creamos múltiples métodos para diferentes propósitos. Después de eso, acoplamos este método a nuestra función principal de acuerdo con nuestros requisitos. Al crear cualquier tipo de vista en Android y configurar los datos para esa vista específica. Primero, inicializamos la vista con variables y luego agregamos datos a esa vista en particular.Este proceso de agrupar elementos de la interfaz de usuario y modelos de vista se denomina acoplamientoCuando nuestro código tiene tanto acoplamiento, resulta difícil mantener estos códigos. Por lo tanto, el acoplamiento a veces le trae algunos errores relacionados con referencias nulas.
· Cuando desarrollamos aplicaciones en Java, generalmente preferimos utilizar el concepto Ver modal, donde encontramos cada vista del archivo de diseño XML en la clase Java y agregamos datos a esa vista específica de acuerdo con nuestros requisitos. En la mayoría de las aplicaciones, utilizamos elementos de la interfaz de usuario para la visualización dinámica, por lo que a veces esto puede generar un error de referencia nula.En este método, los elementos de la interfaz de usuario se declaran en lenguaje XML y las funciones se escriben en Java o Kotlin. Vinculamos los elementos de la interfaz de usuario con nuestras clases de Java o Kotlin. findViewbyId () método.
· Si preferimos usar el mismo lenguaje para escribir nuestros componentes de UI y agregar funciones, nos ayudará a mantener nuestro código más fácilmente. Al usar este método, la cantidad de acoplamiento en nuestro código también se reducirá.
· Ahora que se ha establecido una base sólida, comencemos con algunas ilustraciones prácticas interesantes.
· Instalar en pc: Primero, descargue la última versión de Android Studio Arctic Fox y luego cree una aplicación usando la plantilla Actividad de composición vacía. La plantilla predeterminada ya contiene algunos elementos de composición.
· Funciones componibles: Jetpack Compose se basa en funciones componibles. Estas funciones le permiten definir la interfaz de usuario de una aplicación mediante programación al describir la apariencia de la aplicación y proporcionar dependencias de datos, en lugar de centrarse en el proceso de construcción de la interfaz de usuario (inicializar elementos, adjuntarlos a elementos principales, etc.). Para crear una función componible, simplemente agregue la anotación @Composable al nombre de la función.
· diseño: Los elementos de la interfaz de usuario son jerárquicos y los elementos están contenidos en otros elementos. En Compose, puede construir la jerarquía de la interfaz de usuario llamando a funciones componibles desde otras funciones componibles.
· Diseño de materiales: Compose tiene como objetivo apoyar los principios del diseño de materiales. Muchos de sus elementos de interfaz de usuario han implementado un diseño de material listo para usar. En esta lección, utilizará widgets de material para diseñar su aplicación.
· Lista y animación: Las listas y animaciones están en todas partes de la aplicación. En esta lección, aprenderá cómo Compose facilita la creación de listas y la adición de animaciones de una manera divertida.
· añadir Un elemento de texto: Primero, mostraremos un «¡Hola mundo!». Agrega texto agregando elementos de texto al texto. onCreate método.Puede definir un bloque de contenido y llamar Text() Función.esta setContent Los bloques definen el diseño de actividades que llamamos funciones componibles. Las funciones componibles solo se pueden llamar desde otras funciones componibles. Jetpack Compose utiliza el complemento del compilador de Kotlin para convertir estas funciones componibles en los elementos de la interfaz de usuario de la aplicación. P.ej, Text() Las funciones definidas por la biblioteca Compose UI muestran etiquetas de texto en la pantalla.
· Defina una función componible: Para que la función se pueda componer, agregue @Composable anotación.Para probar esto, defina un MessageCard() Pase el nombre y utilícelo para configurar la función del elemento de texto.
· Obtenga una vista previa de su función en Android Studio: Android Studio le permite obtener una vista previa de las funciones componibles en el IDE en lugar de instalar la aplicación en el dispositivo o emulador de Android. Las funciones componibles deben proporcionar valores predeterminados para cualquier parámetro.Por lo tanto, no puede obtener una vista previa MessageCard() Juega directamente un papel.En su lugar, creemos una segunda función llamada PreviewMessageCard(), transferencia MessageCard() Con los parámetros adecuados.añadir @Preview Nota anterior @Composable.
Reconstruye tu proyecto.La aplicación en sí no cambiará porque la nueva PreviewMessageCard() La función no se llamará en ningún lado, pero Android Studio ha agregado una ventana de vista previa.Esta ventana se muestra marcada por @Preview anotación. Para actualizar la vista previa en cualquier momento, haga clic en el botón de actualización en la parte superior de la ventana de vista previa.
![[ASJ2021] Aprendiendo Android desde cero - Unidades 1–2: Creación de su primera aplicación para Android | Liu Haidi | Mayo de 2021](https://sistemaandroid.info/wp-content/uploads/2021/05/ASJ2021-Aprendiendo-Android-desde-cero-Unidades-1–2-Creacion-de-220x150.png "[ASJ2021] Aprendiendo Android desde cero - Unidades 1–2: Creación de su primera aplicación para Android | Liu Haidi | Mayo de 2021 14")
