flutteraudiooverlapping

Flutter Stop the letter sound when moving to another letter


In case the user did not wait to hear the sound of the letter He moved between the buttons quickly There is an overlap between the voices, and all the voices remain . in the background of the application How to correct or solve the problem? full code

https://github.com/Saleque474/Learn-Alphabet

enter image description here

dependencies : kplayer: ^0.2.4


class _HomeState extends State<Home> {
  String currentAlphabet = "A";
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.amber[200],
      body: LayoutBuilder(builder: (context, constraints) {
        var height = constraints.maxHeight;
        var width = constraints.maxWidth;
        return Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            sentenceHolder(height, width),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                imageHolder(height, width),
                wordHolder(height, width),
              ],
            ),
            Container(
              decoration:
                  BoxDecoration(borderRadius: BorderRadius.circular(15)),
              child: Wrap(
                children: changePos(),
              ),
            ),
          ],
        );
      }),
    );
  }

  playAudio(String path) {
    Player.asset(path).play();
  }

  List<Widget> changePos() {
    List<Widget> children = [
      ...alphabets
          .map(
            (e) => textHolder(e),
          )
          .toList()
    ];

    return children;
  }

Widget textHolder(String alphabet) {
    return Padding(
      padding: const EdgeInsets.all(7),
      child: ElevatedButton(
        onPressed: () {
          currentAlphabet = alphabet;
          playAudio("assets/audio/$alphabet.wav");
          setState(() {});
        },
        child: Text(alphabet),
      ),
    );
  }

// When calling a letter sound is a function

It works normally, but if we move quickly between the letter buttons, we notice that all the sounds work together at the same time //


Solution

  • class _HomeState extends State<Home> {
      AudioPlayer _audioPlayer;
      @override
      void initState() {
        _audioPlayer = AudioPlayer();
        // TODO: implement initState
        super.initState();
      }
    
      @override
      void dispose() {
        // _audioPlayer.dispose();
        super.dispose();
      }
    
      void _playAudio(String assetPath) async {
        _audioPlayer.pause();
        assetPath = ("assets/audio/$currentAlphabet.mp3");
        try {
          await _audioPlayer.setAsset(assetPath);
          _audioPlayer.play();
        } catch (e) {
          debugPrint("Error loading audio source: $e");
        }
      }}
    

    i solved by using just_audio:

    enter image description here

    enter image description here

    enter image description here