Jetpack Compose Overview

Jetpack Compose es el kit de herramientas moderno de Android para compilar UI nativas.
Simplifica y acelera el desarrollo de la UI en Android. Crea interfaces de usuario más rápido con menos código, herramientas potentes y lo mejor de todo una API muy intuitiva de Kotlin.
Esta presentación se muestra los nuevos conceptos básicos y ejemplos de como cambia la forma de crear interfaces de usuario de forma declarativa con Jetpack Compose.

Transcript

1. Jetpack Compose Overview La salvación para los Android Devs nativos.
2. lizarragadev
3. “En el mundo hay mas teléfonos celulares que seres humanos. Stats
4. Gustavo Lizárraga GitHub Campus Expe rt Auth0 Ambassador GitKraken Ambassador Android & iOS Dev Trainer Speaker @lizarragadev
5. Cuando te dicen que actualizarán el diseño de la app y sabes que tienes que modi fi car n-mil archivos XML, agregar montón de dependencias y sabes que se vienen tiempos oscuros sin tiempos libres…
6. Problemas
7. Historia Cambios representativos en herramientas de UI de Android durante los años. 2008 2013 2014 2017 2021 Jetpack Compose ConstraintLayout, Kotlin, Arch Components ART, RecyclerView Android Studio Android release
8. UI Inconsistente Actualizaciones de la UI desde distintos lugares. fi ndViewById(…) Main.kt main.xml
9. Vieja UI Versiones 2.2, 2.3, 4.0
10. Nueva UI Versiones actuales
11. Aferrarse al pasado No desagrupar el kit de herramientas de la inte rf az de usuario. Ni los botones de mi camisa se aferran tanto a aguantar como Google se aferró a seguir haciendo UI con XML.
12. Duras actualizaciones Complejos cambios en actualizaciones de diseño. Cuando el equipo de diseño me envía el nuevo diseño de la app y yo recién acabé de fi xear problemas de la anterior versión.
13. “ “API Design is building future regret” Chet Haase
14. Solución
15. Jetpack Compose
17. Jetpack Compose
18. Kotlin Compiler Plugin Genera código necesario para que Compose funcione.
19. Runtime Realiza un listado de elementos composables que se deben actualizar o mantener de las vistas.
20. UI Library Interpreta el listado de Runtime para dibujarlo en pantalla.
21. Características
22. UI Declarativa
23. Imperativo vs Declarativo ¡Hola a tod@s!
24. Imperativo vs Declarativo • Sólo código • Inicializar con datos • Sincronizar con LiveData, etc. • XML + Código • Inicializar • Sincronizar
25. UI Declarativa Flu tt er Swi ft UI
26. UI Declarativa Compose Hello World!
27. UI como función View/XML Compose UI as Object UI as Function
28. Unbundled UI - OS Nuevo conjunto de widgets de inte rf az de usuario desagregado del sistema operativo.
29. Inspirado en…
30. ¿Cómo iniciamos?
31. Android Studio h tt ps://developer.android.com/studio
32. Compatibilidad Android 5.0 (API 21) o superior
33. Demo
35. XML UI
36. Conclusiones • No más XML. • No más fi ndViewById(…). • Composición sobre herencia. • El nuevo estándar para UI.
37. Referencias • Jetpack Compose • What's new in Compose • Compose From First Principles • Jetpack Compose Internals (Book) • Codelabs - Jetpack Compose Basics
38. Y como dijo mi ex, hasta aquí llegamos…
39. speakerdeck.com/lizarragadev
40. github.com/lizarragadev/ JetpackComposeDemo
41. lizarragadev