ListView.Builder reproducir / pausar el aleteo del botón
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
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.
),
),
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;
});
});
}
}
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.