Android Academy · Lección

Estado con remember y mutableStateOf

Mantenga el estado de la interfaz en composables

Estado con remember y mutableStateOf 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 el estado?

El estado es cualquier valor que puede cambiar con el tiempo y al que la interfaz debe reaccionar: un contador, el contenido de un campo de texto o si una casilla está activada. Cuando cambia el estado, Compose vuelve a dibujar la interfaz.

mutableStateOf

mutableStateOf crea un valor observable. Cuando escribe en él, Compose sabe que debe volver a ejecutar cualquier composable que lo haya leído.

val count = mutableStateOf(0)
// read with count.value, write with count.value = 1

¿Por qué remember?

Los composables pueden ejecutarse muchas veces (recomposición). Si crea el estado en cada ejecución, se restablecerá cada vez. remember indica a Compose que debe conservar el valor entre recomposiciones.

val count = remember { mutableStateOf(0) }

El delegado by

Leer y escribir .value continuamente resulta engorroso. El delegado de propiedad by de Kotlin permite tratar el estado como una variable normal.

var count by remember { mutableStateOf(0) }
// now use count directly, no .value

Importaciones necesarias

Para usar el delegado by, debe importar los auxiliares de lectura y escritura. Android Studio los añade automáticamente.

import androidx.compose.runtime.getValue
import androidx.compose.runtime.setValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember

Un composable de contador

Aquí tiene un contador funcional. Al pulsar el botón, count aumenta y Text se actualiza automáticamente.

@Composable
fun Counter() {
    var count by remember { mutableStateOf(0) }
    Button(onClick = { count++ }) {
        Text(text = "Count: $count")
    }
}

Leer activa la actualización

La clave está en que Text lee count. Compose registra esa lectura, de modo que cuando cambia count, solo esa parte se recompone y muestra el nuevo valor.

El estado admite cualquier tipo

El estado no sirve únicamente para números. Puede contener un String, un Boolean, una lista o su propia clase de datos.

var name by remember { mutableStateOf("") }
var isOn by remember { mutableStateOf(false) }

TextField con estado

Un campo de texto editable necesita el estado de su valor actual y una devolución de llamada para actualizarlo.

var text by remember { mutableStateOf("") }
TextField(
    value = text,
    onValueChange = { text = it }
)

El estado es local

El estado creado con remember vive dentro del composable. Dos llamadas a Counter() tienen cada una su propio contador independiente.

Ejemplo completo

Una pantalla de contador completa que combina todo lo aprendido en esta lección.

@Composable
fun CounterScreen() {
    var count by remember { mutableStateOf(0) }
    Column {
        Text(text = "You tapped $count times")
        Button(onClick = { count++ }) {
            Text(text = "Tap")
        }
    }
}

Comprobación rápida

¿Por qué envolvemos mutableStateOf en remember?

Repaso

Conceptos básicos del estado:

mutableStateOf crea un valor observable.
remember lo conserva entre recomposiciones.
by permite omitir .value.
Leer el estado suscribe un composable a sus cambios.

Preguntas frecuentes

¿La lección «Estado con remember y mutableStateOf» es gratis?

Sí — el texto completo de «Estado con remember y mutableStateOf» 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 «Estado con remember y mutableStateOf»?

Mantenga el estado de la interfaz en composables 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 «Estado con remember y mutableStateOf»?

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

← Volver a Android Academy