ListView.Builder reproducir / pausar el aleteo del botón

Aug 19 2020

Estoy usando un ListView.builder para crear una lista de audio, necesito cambiar la pausa del botón de reproducción individualmente a un elemento cuando lo selecciono, he probado un bool pero al reproducir o pausar cambia todos los elementos de la lista, alguien puede ayudas con eso ??

Respuestas

2 sleepingkit Aug 20 2020 at 00:44

Puede tener una lista de booleanos para guardar qué botón está seleccionado, luego pasar el bool como parámetro al widget de audio y usar el bool para cambiar el icono.

También pase una función de devolución de llamada para cambiar la lista bool, porque tiene que cambiar la lista desde el widget principal, por lo que se necesita una función de devolución de llamada.

 List<bool> audioSelectedList = List.generate(AudioList.length, (i) => false);

// This is a callback function that Audio will call when the button is clicked.
  selected(int index){
// set only one bool to be true
    setState(() {
      audioSelectedList=List.generate(AudioList.length, (i) => false);// set all to false
      audioSelectedList[index]=true;  // set the selected index to be true
    });
  }

Vista de la lista:

ListView.builder(
          itemCount: AudioList.length,
          itemBuilder: (context, index) => Audio(
            selected: selected, // pass the callback function
            index: index, // use to call selected(index)
            isSelected: audioSelectedList[index], // only one bool is true in the list which is the selected index.
          ),
        ),
4 Reign Aug 20 2020 at 00:41
import 'package:flutter/material.dart';

class Sample extends StatefulWidget {
  @override
  _SampleState createState() => _SampleState();
}

class _SampleState extends State<Sample> {
  bool isPressed = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: [
          Column(
            children: [
              IconButton(
                  icon: Icon(isPressed
                      ? Icons.play_circle_filled
                      : Icons.pause_circle_filled),
                  onPressed: () {
                    setState(() {
                      isPressed = !isPressed;
                    });
                  }),
              IconButton(
                  icon: Icon(isPressed
                      ? Icons.play_circle_filled
                      : Icons.pause_circle_filled),
                  onPressed: () {
                    setState(() {
                      isPressed = !isPressed;
                    });
                  }),
              PlayPause(
                isPressed: isPressed,
              ),
              PlayPause(),
            ],
          )
        ],
      ),
    );
  }
}

class PlayPause extends StatefulWidget {
  const PlayPause({
    Key key,
    this.isPressed = false,
  }) : super(key: key);
  final bool isPressed;

  @override
  _PlayPauseState createState() => _PlayPauseState();
}

class _PlayPauseState extends State<PlayPause> {
  bool _isPressed;
  @override
  void initState() {
    super.initState();
    _isPressed = widget.isPressed;
  }

  @override
  Widget build(BuildContext context) {
    return IconButton(
        icon: Icon(
            _isPressed ? Icons.play_circle_filled : Icons.pause_circle_filled),
        onPressed: () {
          setState(() {
            _isPressed = !_isPressed;
          });
        });
  }
}

jack Aug 20 2020 at 02:26

No use un bool para todo su audio, puede usar colecciones para definir un bool para todo en su audioList, y cuando haga clic, cambie el bool para el audio.