Agrega un interruptor que los usuarios puedan activar o desactivar

El componente Switch permite a los usuarios alternar entre dos estados: marcado y no marcado. Usa un interruptor para permitir que el usuario realice una de las siguientes acciones:

  • Activar o desactivar un parámetro de configuración
  • Habilitar o inhabilitar una función
  • Seleccionar una opción

El componente tiene dos partes: el pulgar y la pista. El pulgar es la parte arrastrable del interruptor, y la pista es el fondo. El usuario puede arrastrar el pulgar hacia la izquierda o la derecha para cambiar el estado del interruptor. También puede presionar el interruptor para marcarlo y borrarlo.

Compatibilidad de versiones

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

Dependencias

Implementa un interruptor

El siguiente ejemplo es una implementación mínima del elemento de componibilidad Switch:

Resultados

Es un interruptor básico que no está marcado.
Figura 1. Un interruptor no marcado
Un interruptor básico que está marcado.
Figura 2. Un interruptor marcado

Crea un pulgar personalizado

Puedes pasar cualquier elemento de componibilidad para el parámetro thumbContent para crear un pulgar personalizado. El siguiente es un ejemplo de un interruptor que usa un ícono personalizado para su pulgar:

Resultados

La apariencia no marcada es la misma que la del ejemplo de la sección anterior. Sin embargo, cuando se marca, esta implementación aparece de la siguiente manera:

Un interruptor que usa el parámetro thumbContent para mostrar un ícono personalizado cuando está marcado.
Figura 3. Un interruptor con un ícono marcado personalizado

Usa colores personalizados

Usa el parámetro colors para cambiar el color del pulgar y la pista de un interruptor, teniendo en cuenta si el interruptor está marcado.

Resultados

Un interruptor que usa el parámetro colors para mostrar un interruptor con colores personalizados para el control deslizante y el tope.
Figura 4: Un interruptor con colores personalizados

Puntos clave

  • Parámetros básicos:

    • checked: Es el estado inicial del interruptor.
    • onCheckedChange: Es una devolución de llamada a la que se llama cuando cambia el estado del interruptor.
    • enabled: Indica si el interruptor está habilitado o inhabilitado.
    • colors: Son los colores que se usan para el interruptor.

  • Parámetros avanzados

    • thumbContent: Úsalo para personalizar la apariencia del pulgar cuando está marcado.
    • colors: Úsalo para personalizar el color de la pista y el pulgar.

Colecciones que contienen esta guía

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

Aprende cómo las funciones de componibilidad pueden permitirte crear fácilmente componentes de IU atractivos basados en el sistema de diseño de Material Design system.
Colección de guías rápidas

¿Tienes preguntas o comentarios?

Visita nuestra página de preguntas frecuentes y obtén información sobre las guías rápidas o comunícate con nosotros y cuéntanos tu opinión.
Ir a las Preguntas frecuentes Cómo enviar comentarios