RadioListTile

 

RadioListTile en Flutter: Elige una Opción

¿Qué es un RadioListTile?

Un RadioListTile en Flutter es un widget que combina un botón de radio (radio button) con una lista. Se utiliza principalmente para presentar una lista de opciones mutuamente excluyentes, donde el usuario puede seleccionar solo una de ellas. Es como un grupo de botones de radio en una interfaz web, pero con las ventajas y flexibilidad que ofrece Flutter.

Imagina un formulario donde el usuario debe seleccionar su género. Aquí, un RadioListTile sería ideal para presentar las opciones "Masculino", "Femenino" y "Otro" en una lista vertical, donde al seleccionar una, las demás se desmarcan automáticamente.

¿Cómo se usa?

Para utilizar un RadioListTile, necesitas definir un grupo de opciones y un valor para representar la opción seleccionada actualmente. Aquí tienes un ejemplo básico:

Dart
import 'package:flutter/material.dart';

class MyRadioListTileExample extends StatefulWidget {
  @override
  _MyRadioListTileExampleState createState() => _MyRadioListTileExampleState();
}

class _MyRadioListTileExampleState extends State<MyRadioListTileExample> {
  String? _selectedGender;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        RadioListTile(
          title: Text('Masculino'),
          value: 'Masculino',
          groupValue: _selectedGender,
          onChanged: (String? value) {
            setState(() {
              _selectedGender = value;
            });
          },
        ),
        RadioListTile(
          title: Text('Femenino'),
          value: 'Femenino',
          groupValue: _selectedGender,
          onChanged: (String? value) {
            setState(() {
              _selectedGender = value;
            });
          },
        ),
        // ... y así sucesivamente para otras opciones
      ],
    );
  }
}

Explicación del código:

  • groupValue: Este atributo es crucial. Todos los RadioListTile dentro de un mismo grupo deben compartir el mismo groupValue. Esto asegura que solo uno pueda estar seleccionado a la vez.
  • value: El valor único de cada opción. Cuando se selecciona una opción, el groupValue se actualiza a este valor.
  • onChanged: Esta función se ejecuta cuando se selecciona una opción y te permite actualizar el estado de tu widget.

Propiedades importantes de RadioListTile

  • title: El texto que se muestra junto al botón de radio.
  • subtitle: Un texto secundario que puede proporcionar más información.
  • secondary: Un widget que se muestra a la derecha del título.
  • activeColor: El color del botón de radio cuando está seleccionado.

Usos comunes de RadioListTile

  • Formularios: Para seleccionar una opción de un conjunto de opciones mutuamente excluyentes.
  • Configuraciones: Para permitir que el usuario seleccione una configuración entre varias opciones.
  • Filtros: Para filtrar datos basados en la selección del usuario.

En resumen

El RadioListTile es un widget versátil en Flutter que te permite crear interfaces de usuario intuitivas y fáciles de usar. Es ideal para situaciones donde el usuario debe seleccionar una sola opción de un conjunto de opciones predefinidas.


Comentarios

Entradas más populares de este blog

Paquete http en Flutter

Image

Menú lateral Drawer.