'how to make search bar to search a song and play it flutter

thats all i want so please help me thx its flutter code using dart i want to search and play the song please help me to do that

i just want help to do that to can upload the app on app store thanks just me app and this the link on github https://github.com/montasermohamed101/Music_flutter

 class MusicScreen extends StatefulWidget {
    
      @override
      _MusicScreenState createState() => _MusicScreenState();
    }
    
    class _MusicScreenState extends State<MusicScreen> {
    
      final AssetsAudioPlayer audioPlayer = AssetsAudioPlayer();
    
      double screenHeight = 0;
      double screenWidth = 0;
    
      List<Audio> audioList = [
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/beautiful.mp3',metas: Metas(title: 'Beautiful')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter2')),
        Audio('assets/letter.mp3',metas: Metas(title: 'Letter3')),
      ];
    
    
      @override
      void initState() {
        super.initState();
        setupPlaylist();
      }
    
      void setupPlaylist()async
      {
        await audioPlayer.open(Playlist(audios: audioList),
          showNotification: true,autoStart: false
        );
      }
    
      @override
      void dispose() {
        super.dispose();
        audioPlayer.dispose();
      }
    
      Widget playlist(RealtimePlayingInfos realtimePlayingInfos)
      // this widget is the ListView widget
      {
        return Container(
          // this is the container that Control the listView
          height: screenHeight * 0.7,
          decoration: BoxDecoration(
            image: DecorationImage(image: AssetImage('assets/y.jpg'),fit: BoxFit.cover),
          ),
          alignment: Alignment.bottomLeft,
          child: ListView.builder(
            itemBuilder: (context,index)
            {
              return playlistItem(index);
            }, shrinkWrap: true,
            itemCount: audioList.length,
          ),
        );
      }
    
      Widget playlistItem(int index)
      {
        // this Widget to show the song name and title and number in the container
        return InkWell(
          onTap: () => audioPlayer.playlistPlayAtIndex(index),
          splashColor: Colors.transparent,
          highlightColor: Colors.yellow,
          child: Container(
            height: screenHeight * 0.1,
            child: Padding(padding: const EdgeInsets.only(
              left: 20,right: 20,
            ),child: Row(
              children: [
                Text('${index + 1}',style: TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                ),),
                SizedBox(width: screenWidth * 0.04,),
                Expanded(child:
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(audioList[index].metas.title,
                      style: TextStyle(
                        fontSize: 15,
                        color: Colors.white,
                        fontWeight: FontWeight.bold,
                      ),),
                    SizedBox(height: screenHeight * 0.005,),
    
                  ],
                )
                ),
                Icon(Icons.ac_unit,color: Colors.white,),
              ],
            ),
            ),
          ),
        );
      }
    
      Widget bottom(RealtimePlayingInfos realtimePlayingInfos)
      {
        return Container(
          height: screenHeight * 0.2,
          color: Colors.white,
          child: Container(
          //  height: screenHeight  * 0.1,
            color: Colors.green,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text('${audioPlayer.getCurrentAudioTitle}'
                  ,style: TextStyle(
                      color: Colors.white,
                      fontWeight: FontWeight.w900,
                      fontSize: 18
                  ),),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    getTimeText(realtimePlayingInfos.currentPosition),
                    slider(realtimePlayingInfos.currentPosition,
                        realtimePlayingInfos.duration),
                    getTimeText(realtimePlayingInfos.duration),
    
                  ],
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    IconButton(
                        onPressed: () => audioPlayer.previous(),
                        iconSize: 50,
                        icon: Icon(Icons.skip_previous_rounded)),
                    IconButton(
                        onPressed: () => audioPlayer.playOrPause(),
                        iconSize: 50,
                        icon: Icon(realtimePlayingInfos.isPlaying? Icons.pause_circle_filled_rounded : Icons.play_circle_outline_rounded)),
                    IconButton(
                        onPressed: () => audioPlayer.next(),
                        iconSize: 50,
                        icon: Icon(Icons.skip_next_rounded)),
                  ],
                ),
              ],
            ),
          ),
        );
      }
    
    
      @override
      Widget build(BuildContext context) {
        screenHeight = MediaQuery.of(context).size.height;
        screenWidth = MediaQuery.of(context).size.width;
        return Scaffold(
          appBar: AppBar(
            backgroundColor: Colors.green,
          ),
          backgroundColor: Colors.blue,
          body: audioPlayer.builderRealtimePlayingInfos(builder: (context,realtimePlayingInfos)
          {
            return  Container(
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    Column(
                      children: [
                        playlist(realtimePlayingInfos),
                        bottom(realtimePlayingInfos),
                      ],
                    ),
    
    
                  ],
                ),
              ),
            );
          }),
    
    
        );
      }
      Widget slider(Duration currentPosition,Duration duration) {
        return Stack(
          children: [
            Container(
              height: screenHeight * 0.01,
            ),
            SliderTheme(
                data: SliderThemeData(
                    thumbColor: Colors.white,
                    activeTrackColor: Color(0xff10d541),
                    inactiveTrackColor: Colors.grey[800],
                    overlayColor: Colors.transparent),
                child: Slider.adaptive(
                    value:
                    currentPosition.inSeconds.toDouble(),
                    max: duration.inSeconds.toDouble() + 3,
                    min: -3,
                    onChanged: (value) {
                      if (value <= 0) {
                        audioPlayer.seek(Duration(seconds: 0));
                      }else {
                        audioPlayer.seek(Duration(seconds: value.toInt()));
                      }
                    })),
          ],
        );
      }
    
      Widget getTimeText(Duration seconds)
      {
        return Text(transformString(seconds.inSeconds),
          style: TextStyle(
            color: Colors.white,
          ),);
      }
    
      String transformString(int seconds) {
        String minuteString =
            '${(seconds / 60).floor() < 10 ? 0 : ''}${(seconds / 60).floor()}';
    
        String secondString = '${seconds % 60 < 10 ? 0 : ''}${seconds% 60}';
        return '$minuteString:$secondString'; // Returns a string with the format mm:ss
      }
    
    
    
    
    
    
    }

how to make search bar to can search about any song



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source