¿Qué es Jetpack Compose?
Comprenda la interfaz de usuario declarativa en Android
¿Qué es Jetpack Compose? es una lección gratuita de Android Academy en CoddyKit. Esta es la lección 1 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Android Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Android Academy incluye 4 lecciones en total.
¿Qué es Jetpack Compose?
Jetpack Compose es el kit de herramientas moderno de Android para crear interfaces de usuario nativas. En lugar de escribir archivos de diseño XML, describa la interfaz directamente en código Kotlin.
Compose es declarativo: indica qué aspecto debe tener la pantalla para un estado determinado y Compose se encarga de decidir cómo dibujarla y actualizarla.
La forma tradicional: vistas XML
Tradicionalmente, una pantalla de Android necesitaba dos partes:
- Un archivo de diseño XML que describía los widgets.
- Código Kotlin/Java que buscaba esas vistas con
findViewByIdy las modificaba.
Mantener sincronizados el XML y el código resultaba tedioso y propenso a errores.
<!-- res/layout/activity_main.xml -->
<TextView
android:id="@+id/greeting"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />Imperativo frente a declarativo
Con las vistas XML se escribe código imperativo: se obtiene una vista y después se modifica paso a paso.
Con Compose se escribe código declarativo: se describe el resultado final como una función de los datos. Cuando cambian los datos, Compose vuelve a dibujar automáticamente lo necesario.
// Imperative (old views)
val tv = findViewById<TextView>(R.id.greeting)
tv.text = "Hello"
tv.visibility = View.VISIBLEFunciones componibles
El bloque de construcción de Compose es la función componible: una función normal de Kotlin anotada con @Composable que emite la interfaz.
Las funciones componibles pueden llamar a otras funciones componibles, lo que permite crear pantallas a partir de piezas pequeñas y reutilizables.
@Composable
fun Greeting(name: String) {
Text(text = "Hello, $name!")
}Sin findViewById
En Compose no existe findViewById ni hay identificadores de vista. La interfaz es la llamada a la función. Para mostrar un texto diferente, basta con pasar otro argumento y dejar que Compose recomponga la interfaz.
@Composable
fun Screen() {
Greeting(name = "Ada")
Greeting(name = "Linus")
}La interfaz como función del estado
Una idea fundamental: UI = f(state). La pantalla es el resultado de sus funciones componibles a partir del estado actual. Cambie el estado y la misma función generará una interfaz nueva.
Esto hace que las interfaces sean predecibles y más fáciles de entender.
Todo es Kotlin
Como las funciones componibles son funciones de Kotlin, puede usar bucles, condicionales y variables para crear la interfaz. No se necesita ningún lenguaje de plantillas especial.
@Composable
fun Items(names: List<String>) {
for (n in names) {
Text(text = n)
}
}Menos código repetitivo
Compose elimina grandes cantidades de código de conexión. No hay inflación de XML, adaptadores para listas sencillas ni conexiones manuales entre el diseño y la lógica.
El resultado: menos archivos y menos errores.
Interoperabilidad con Views
No tiene que reescribir una aplicación completa. Compose interopera con el antiguo sistema de View. Puede insertar Compose en una pantalla XML existente o insertar una View en Compose.
Esto permite a los equipos migrar gradualmente.
Lo que necesita
Para usar Compose necesita:
- Una versión reciente de Android Studio.
- Las dependencias de Compose en su archivo Gradle.
- Una activity que llame a
setContent { }para alojar las funciones componibles.
Una pantalla diminuta
A continuación tiene una pantalla Compose mínima y completa. setContent es el puente entre la Activity de Android y el mundo de Compose.
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
Greeting(name = "World")
}
}
}Comprobación rápida
¿Cuál describe mejor Jetpack Compose?
Repaso
Ha aprendido que Jetpack Compose es un kit de herramientas de interfaz declarativo y centrado en Kotlin. Ideas clave:
- La interfaz se crea a partir de funciones
@Composable. - No hay XML ni
findViewById. - UI = f(state): cambie el estado y Compose volverá a dibujar la interfaz.
Preguntas frecuentes
¿La lección «¿Qué es Jetpack Compose?» es gratis?
Sí — el texto completo de «¿Qué es Jetpack Compose?» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Android Academy, actualiza a CoddyKit PRO. El curso de Android Academy incluye 4 lecciones en total.
¿Qué aprenderé en «¿Qué es Jetpack Compose?»?
Comprenda la interfaz de usuario declarativa en Android Practicas Android Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Android Academy?
No se requiere experiencia previa. Android Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 1 de 4.
¿Cuánto tiempo toma la lección «¿Qué es Jetpack Compose?»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Android Academy?
Sí. Cada lección de Android Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- ¿Qué es Jetpack Compose?
- Su primer composable
- Texto, imagen y botón
- Previsualizaciones y Hot Reload