Discount !! E-commerce App With Backend Source Code Video and Voice Chatting App Firebase Chatting App Source Code Complete Gym App BLoC State Management Source Code Complete Study App Buy Ticket Booking App Source Code Payment App Buy Travel App With Backend Source Code Complete Chat App Udemy Course Special Offer Discount !! Online Learning Course App (BLoC) Discount !! Online Learning Course App (Riverpod) Discount !! Online Learning Course App (Getx)

Flutter Audio Player

Flutter Audio Player

    Here you will learn how to step by step build an audio player using flutter. We will build a complete ui for the audio player and will have the below functions for the app.

    1. load audio from the internet

    2. play audio

    3. play audio fast (fast forward and backward)

    4. play audio slow

    5. pause the audio

    6. resume the audio

    7. show the time on the slider

    Download the resources for the audio player

    https://www.dbestech.com/audio_img.zip

    Watch Youtube Video here

    Upgrade

    Run the below commands to upgrade

    1. Run flutter upgrade in the terminal to upgrade Flutter
    2. Run dart migrate to run the dart migration tool.
    3. flutter pub upgrade --null-safety
    4. Check the code for errors and solve them (Very important).
    5. Run dart migrate again and it should now be successful. Follow the link to checkout the proposed changes.
    6. Press the "Apply Migration" button.
    7. Check the code for errors again and fix them.

     

    Errors and warnings fix

    Lot of the errors happens if you upgrade to flutter 3.0

    1. There could be errors about the IconButton

      Widget btnLoop() {
    return IconButton(
        icon:   ImageIcon(
          AssetImage('img/loop.png'),
          size: 15,
          color: Colors.black,
        ), onPressed: () {  },
    );
  }

    In the above code we added the onPressed event.

    2. Make the following change from

    this.widget.advancedPlayer!.setPlaybackRate(playbackRate: 0.5);

    to

    this.widget.advancedPlayer!.setPlaybackRate(0.5);

    playbackRate is not defined in setPlaybackRate() new version of the plugin and flutter upgrade. So we need to remove it.

    3.  Change setUrl() to the below code

        /*
    change setUrl to setSourceUrl
     */
    this.widget.advancedPlayer!.setSourceUrl(this.widget.audioPath!);

    4. Change onPlayerCompletion to onPlayerComplete

     this.widget.advancedPlayer!.onPlayerComplete.listen((event) {
.......................................................................................................

    Find me on twitter @dbestech

    Show time on Slider

    If you get error during the slider part, make sure your code is like below

      Widget slider() {
    return Slider(
        activeColor: Colors.red,
        inactiveColor: Colors.grey,
        value: _position.inSeconds.toDouble(),
        min: 0.0,
        max: _duration.inSeconds.toDouble(),
        onChanged: (double value) {
          setState(() {
            changeToSecond(value.toInt());
            value = value;
          });});
  }

  void changeToSecond(int second){
    Duration newDuration = Duration(seconds: second);
    this.widget.advancedPlayer.seek(newDuration);
  }

    Make sure that, you are calling the slider() method inside build method().

      @override
  Widget build(BuildContext context) {
    return
      Container(child:
      Column(
      children: [
      ............................

        slider(),
        loadAsset(),
      ],
    )

    );
  }

    Code for app_colors.dart

    import 'dart:ui';

final Color background = Color(0xFFfafafc);
final Color sliverBackground = Color(0xFFfafafc);
final Color menu1Color=Color(0xFFf9d263);
final Color menu2Color= Color(0xFFf2603d);
final Color menu3Color= Color(0xFF04abe6);
final Color tabVarViewColor=Color(0xFFfdfdfd);
final Color starColor=Color(0xFFfdc746);
final Color subTitleText=Color(0xFFc5c4ca);
final Color loveColor=Color(0xFF00ace6);
final Color audioBluishBackground=Color(0xFfdee7fa);
final Color audioBlueBackground= Color(0xFF04abe7);
final Color audioGreyBackground=Color(0xFFf2f2f2);

    Keep playing the music player

     onPressed: (){
                        Navigator.of(context).pop();
                        advancedPlayer.stop();
                        },

    remove the stop() method if you want to 

    Recent posts