Crea un botón para habilitar el desplazamiento de ajuste

Puedes mostrar un botón para permitir que un usuario salte a un punto específico de una lista, lo que ahorra tiempo y aumenta su participación.

Compatibilidad de versiones

Esta implementación requiere que el minSDK de tu proyecto se establezca en el nivel de API 21 o superior.

Dependencias

Crea un botón para habilitar el desplazamiento de ajuste

Usa el siguiente código para crear un botón para el desplazamiento suave en una lista diferida vertical con 10 elementos:

@Composable
fun MessageList(modifier: Modifier = Modifier) {
    val listState = rememberLazyListState()
    val coroutineScope = rememberCoroutineScope()

    LazyColumn(state = listState, modifier = Modifier.height(120.dp)) {
        items(10) { index ->
            Text(
                modifier = Modifier.height(40.dp),
                text = "Item $index"
            )
        }
    }

    Button(onClick = {
        coroutineScope.launch {
            listState.animateScrollToItem(index = 0)
        }
    }) {
        Text(text = "Go top")
    }
}
LazyListSnippets.kt

Puntos clave sobre el código

  • Usa el objeto listState para recordar el estado de desplazamiento de LazyColumn en la posición seleccionada.
  • Inicia una corrutina para llamar a listState.animateScrollToItem, que se desplaza hasta el elemento indexado mientras anima la acción de desplazamiento.

Resultados

Una lista de desplazamiento vertical con un botón activo
Figura 1: Una lista de desplazamiento vertical con un botón de desplazamiento de ajuste.

Colecciones que contienen esta guía

Esta guía forma parte de estas colecciones de guías rápidas seleccionadas que abarcan objetivos más amplios de desarrollo de Android:

Las listas y las cuadrículas permiten que tu app muestre colecciones de una forma visualmente atractiva y fácil de consumir para los usuarios.
Colección de guías rápidas
Descubre cómo las funciones de componibilidad pueden ayudarte a crear fácilmente componentes de IU atractivos basados en el sistema de diseño de Material Design.
Colección de guías rápidas
En esta serie de videos, se presentan varias APIs de Compose y se muestra rápidamente lo que está disponible y cómo usarlo.
Colección de guías rápidas

Tienes preguntas o comentarios

Ve a nuestra página de preguntas frecuentes para obtener información sobre las guías rápidas o comunícate con nosotros para contarnos tu opinión.
Ir a las Preguntas frecuentes Enviar comentarios