How to List MP3 Audio Files from Storage and SD Card on Flutter App

Are you making an Audio player App with Flutter? Here is the example in which we have shown to list all the Audio files from local storage and SD Card. You can implement similarly to your project. Previously, we had posted code to list all PDF files from Storage and view it on click. The output of the code is like below.

To list and view Audio Files files from internal/external storage, you have to use flutter_file_manager, path, and path_provider_ex flutter package. Add the following lines in your pubspec.yaml file to add this package in your dependency.

dependencies:
  flutter:
    sdk: flutter
  path: ^1.6.4
  path_provider_ex: ^1.0.1
  flutter_file_manager: ^0.2.0

Add read / write permissions in your android/app/src/main/AndroidManifest.xml before <application> tag.

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>

If you still get the Permission Denied error, add the following line on AndroidManifest.xml file.

<application
      android:requestLegacyExternalStorage="true"

lib/main.dart: Flutter dart code, see the explanation in the comment.

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_file_manager/flutter_file_manager.dart';
import 'package:path_provider_ex/path_provider_ex.dart';
//import package files

void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return  MaterialApp(
          home: MyAudioList(),
    );
  }
}

//apply this class on home: attribute at MaterialApp()
class MyAudioList extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    return _MyAudioList(); //create state 
  }
}

class _MyAudioList extends State<MyAudioList>{
  var files;
 
  void getFiles() async { //asyn function to get list of files
      List<StorageInfo> storageInfo = await PathProviderEx.getStorageInfo();
      var root = storageInfo[0].rootDir; //storageInfo[1] for SD card, geting the root directory
      var fm = FileManager(root: Directory(root)); //
      files = await fm.filesTree( 
        excludedPaths: ["/storage/emulated/0/Android"],
        extensions: ["mp3"] //optional, to filter files, list only mp3 files
      );
      setState(() {}); //update the UI
  }

  @override
  void initState() {
    getFiles(); //call getFiles() function on initial state. 
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title:Text("Audio File list from Storage"),
        backgroundColor: Colors.redAccent
      ),
      body:files == null? Text("Searching Files"):
           ListView.builder(  //if file/folder list is grabbed, then show here
              itemCount: files?.length ?? 0,
              itemBuilder: (context, index) {
                    return Card(
                      child:ListTile(
                         title: Text(files[index].path.split('/').last),
                         leading: Icon(Icons.audiotrack),
                         trailing: Icon(Icons.play_arrow, color: Colors.redAccent,),
                         onTap: (){
                            // you can add Play/push code over here
                         },
                      )
                    );
              },
          )
    );
  }
}

Output: