Cómo comenzar a usar Jetpack Compose

Jetpack Compose es el kit de herramientas moderno para crear IUs de Android, lo que simplifica el desarrollo de apps que se adaptan a cualquier tamaño de pantalla.

• Descripción general: Consulta los recursos disponibles para los desarrolladores de Compose.
• Instructivo: Comienza a usar Compose creando una IU básica.
• Guías rápidas: Prueba nuestras guías rápidas y enfocadas, diseñadas para que alcances tu objetivo lo más rápido posible.

Base

• Cómo pensar en Compose: En qué difiere el enfoque declarativo de Compose del enfoque basado en vistas que quizás hayas usado antes. Crea un modelo mental de trabajo con Compose.
• Administración del estado: Configura y usa el estado en tu app de Compose.
• Ciclo de vida de los elementos componibles: Ciclo de vida de un elemento componible y cómo Compose determina si debe volver a dibujarse.
• Modificadores: Usa modificadores para aumentar o decorar tus elementos componibles.
• Efectos secundarios en Compose: Formas de administrar los efectos secundarios.
• Fases de Jetpack Compose: Los pasos que sigue Compose para renderizar la IU de tu app y cómo usar esa información para escribir código eficiente.
• Capas de arquitectura: Las capas de arquitectura que componen Jetpack Compose y los principios básicos que conforman el diseño de Compose.
• Rendimiento: Evita los errores comunes de programación que pueden degradar el rendimiento de la app.
• Semántica en Compose: El árbol de semántica que organiza tu IU de una manera que los servicios de accesibilidad y los frameworks de prueba puedan usar.
• Datos de alcance local con CompositionLocal: Usa CompositionLocal para pasar datos a través de la composición.

IU adaptativa

• Compila apps adaptables: Obtén información sobre los principios básicos para crear diseños optimizados para cualquier tamaño de pantalla, incluidos teléfonos, tablets, dispositivos plegables y mucho más.
• Aplica diseños comprobados: Usa diseños canónicos, como el de lista-detalles y el panel de apoyo, para apps optimizadas en pantallas grandes.
• Navegación adaptable: Implementa patrones de navegación que se ajusten automáticamente al espacio de visualización disponible.

Entorno de desarrollo

• Android Studio con Compose: Cómo configurar tu entorno de desarrollo para usar Compose.
• Herramientas para Compose: Las nuevas funciones de Android Studio para admitir Compose.
• Kotlin para Compose: Los modismos específicos de Kotlin funcionan con Compose.
• Compara las métricas de Compose y de vistas: Cómo la migración a Compose puede afectar el tamaño del APK de tu app y el rendimiento del tiempo de ejecución.
• Lista de materiales: Administra todas tus dependencias de Compose especificando solo la versión de la BoM.

Diseño

• Diseños: Componentes de diseño de Compose y cómo crear uno propio.
  • Conceptos básicos sobre el diseño: Los componentes fundamentales para una IU de app sencilla.
  • Componentes y diseños de Material: Componentes y diseños de Material en Compose.
  • Diseños personalizados: Toma el control del diseño de tu app y crea uno personalizado por tu propia cuenta.
  • Líneas de alineación: Crea guías de alineación personalizadas para alinear con exactitud y posicionar los elementos de tu IU.
  • Medidas intrínsecas: Cómo consultar información sobre elementos secundarios antes de medirlos, ya que Compose mide los elementos de la IU solo una vez por pase.
  • ConstraintLayout: Usa ConstraintLayout en la IU de Compose.
• Diseño de sistemas: Implementa un sistema de diseño y dale a tu app un aspecto coherente.
  • Material Design 3: Implementa Material You con la implementación de Material Design 3 de Compose .
  • Cómo migrar de Material 2 a Material 3: Migra tu app de Material Design 2 a Material Design 3 en Compose.
  • Material Design 2: Personaliza la implementación de Compose de Material Design 2 para que se adapte a la marca de tu producto.
  • Sistemas de diseño personalizado: Implementa un sistema de diseño personalizado en Compose y adapta los elementos componibles existentes de Material Design para el nuevo sistema de diseño.
  • Anatomía de un tema: Construcciones de nivel inferior y APIs que usan MaterialTheme y los sistemas de diseño personalizado.
• Listas y cuadrículas: Opciones de Compose para administrar y mostrar listas y cuadrículas de datos.
• Texto: Opciones principales en Compose para mostrar y editar texto.
• Gráficos: Funciones de Compose para compilar y trabajar con gráficos personalizados.
• Animación: Opciones de Compose para animar los elementos de tu IU.
• Gestos: Compila una IU de Compose que detecte gestos del usuario e interactúe con ellos.
• Controla las interacciones del usuario: Cómo Compose abstrae las entradas de nivel bajo en interacciones de nivel alto para que puedas personalizar la manera en que tus componentes responden a las acciones del usuario.

Cómo adoptar Compose

• Migra apps basadas en vistas: Migra tu app basada en vistas a Compose.
  • Estrategia de migración: Cómo incorporar Compose de forma segura y progresiva a tu base de código.
  • APIs de interoperabilidad: APIs de Compose para ayudarte a combinar Compose con una IU basada en vistas.
  • Otras consideraciones: Temas, arquitectura, pruebas y otras consideraciones mientras migras tu app basada en vistas a Compose.
• Compose y otras bibliotecas: Cómo usar bibliotecas basadas en vistas en tu contenido de Compose.
• Arquitectura de Compose: Implementa el patrón de flujo unidireccional en Compose, implementa eventos y contenedores de estados, y trabaja con ViewModel en Compose.
• Navegación: Usa NavController para integrar el componente de Navigation con tu IU de Compose.
• Recursos: Trabaja con los recursos de tu app en tu código de Compose.
• Accesibilidad: Adapta la app para usuarios con requisitos de accesibilidad.
• Prueba: Prueba el código de Compose.
  • Prueba de hoja de referencia: Una referencia rápida a las APIs de prueba de Compose útiles.

Recursos adicionales

• Iniciar configuración
• Programa de aprendizaje seleccionado
• Lineamientos de la API de Compose
• Referencia de la API
• Codelabs
• Apps de ejemplo
• Videos

Recomendaciones para ti

• Nota: El texto del vínculo se muestra cuando JavaScript está desactivado
• Datos de alcance local con CompositionLocal
• Otras consideraciones
• Anatomía de un tema en Compose