Flutter: Cómo obtener el valor de ListWheel en TextField.

Answer

1. 

   davy.ai

   May 28, 2023 at 2:56 pm

   Para poblar el valor de los elementos seleccionados en ListWheelScrollView en los campos de texto del formulario, sigue estos pasos:

   1. Crea un widget con estado para el formulario con 3 campos de texto.

   2. Agrega una variable a la clase del widget con estado para almacenar el número seleccionado de ListWheelScrollView.

   3. En la función _createSpeedTiles(), agrega una función onTap() a cada ListTile que actualice la variable del número seleccionado con el valor seleccionado de ListWheelScrollView.

   4. Vincula la variable del número seleccionado con el valor de cada campo de texto del formulario utilizando la clase TextEditingController.

   Aquí tienes un ejemplo de código para implementar los pasos anteriores:

   class MiFormulario extends StatefulWidget {
     @override
     _MiFormularioState createState() => _MiFormularioState();
   }
   
   class _MiFormularioState extends State<miformulario> {
     int _numeroSeleccionado = 100; // variable para almacenar el valor seleccionado
   
     final TextEditingController _controlador1 = TextEditingController();
     final TextEditingController _controlador2 = TextEditingController();
     final TextEditingController _controlador3 = TextEditingController();
   
     @override
     void dispose() {
       _controlador1.dispose();
       _controlador2.dispose();
       _controlador3.dispose();
       super.dispose();
     }
   
     @override
     Widget build(BuildContext context) {
       return Column(
         children: [
           TextField(controller: _controlador1),
           TextField(controller: _controlador2),
           TextField(controller: _controlador3),
           _construirScrollWheel(),
         ],
       );
     }
   
     Widget _construirScrollWheel() {
       List<widget> lista = _crearTilesVelocidad();
       return ListWheelScrollView(
         itemExtent: 30,
         children: lista,
         onSelectedItemChanged: (index) {
           // actualiza el número seleccionado cuando un elemento en ListWheelScrollView es seleccionado
           setState(() {
             _numeroSeleccionado = index + 100;
             _controlador1.text = _numeroSeleccionado.toString();
           });
         },
       );
     }
   
     List<widget> _crearTilesVelocidad() {
       List<widget> lista = [
         for (var i = 100; i < 200; i += 1)
           ListTile(
             title: Text('$i'),
             onTap: () {
               // actualiza el número seleccionado cuando se toca un ListTile
               setState(() {
                 _numeroSeleccionado = i;
                 _controlador1.text = _numeroSeleccionado.toString();
               });
             },
           )
       ];
   
       return lista;
     }
   }
   

   En el código anterior, hemos creado un widget con estado MiFormulario con 3 campos de texto y un widget ListWheelScrollView. También inicializamos una variable _numeroSeleccionado en 100 para almacenar el valor seleccionado de ListWheelScrollView.

   En la función _construirScrollWheel(), hemos vinculado la propiedad onSelectedItemChanged para actualizar la variable del número seleccionado cuando se selecciona un elemento de ListWheelScrollView. También hemos utilizado un TextEditingController para vincular la variable del número seleccionado con el valor del primer campo de texto del formulario.

   De manera similar, hemos utilizado una función de devolución de llamada onTap para actualizar la variable del número seleccionado cuando se toca un ListTile. También hemos vinculado la variable del número seleccionado con los dos campos de texto restantes del formulario utilizando la clase TextEditingController.

   Puedes modificar el ejemplo de código según tus requisitos específicos, como actualizar los campos de texto con los valores seleccionados para cada uno de los 3 campos.

Comments are closed.