Hey Everyone,
Today in this article we are going to learn about how to get audio information from local storage in flutter project.
Introduction
To get all the audio information from the local storage we have to use a package called “on_audio_query: any” which will work on both Android and iOS.
Using this package we will get all the information about audio for ex. Title, format, duration, size etc.
So please follow below steps for used this package.
Step 1: create new flutter project
Step 2: Add the following dependency into your pubspec.yaml file
dependencies: on_audio_query: ^2.6.0
Step 3: Permission Request
Now we have to add some code for get user permission for read storage so for android add the following code into your AndroidManifest.xml file.
<manifest> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/> </manifest>
For iOS add the following code into your Info.plist file.
<key>NSAppleMusicUsageDescription</key> <string>..Add a reason..</string>
Step 4: Import on audio query package into your main.dart file.
import 'package:on_audio_query/on_audio_query.dart';
Step 5: Now we have to get all the song details before our screen is load so add following function in your initstate((){}).
List<SongModel> allSongList = [];
final OnAudioQuery _audioQuery = OnAudioQuery();
bool isLoading = true;
@override
void initState() {
super.initState();
getAllSongList();
}
getAllSongList() async {
setState(() {
isLoading = true;
});
allSongList = await _audioQuery.querySongs();
}
Step 6: Now we can use all Song List function to list out all the song details. So add following code in to your widget body.
ListView(
children: [
for (var i = 0; i < allSongList.length; i++)
Container(
key: ValueKey(allSongList[i]),
child: Padding(
padding: EdgeInsets.all(8.0),
child: Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
QueryArtworkWidget(
id: allSongList[i].id,
type: ArtworkType.AUDIO,
nullArtworkWidget: Container(
height: 50.h,
width: 50.w,
padding: const EdgeInsets.all(4),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.black,
image: DecorationImage(
image: AssetImage(blackLogoIcon),
),
),
),
),
SizedBox(width: 10.w),
Expanded(
flex: 3,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(
"${allSongList[i].title}",
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: TextStyle(
fontFamily: fontFamilyPoppins,
fontWeight: FontWeight.w600,
fontSize: 14.sp,
),
),
SizedBox(height: 2),
Text(
"${allSongList[i].artist}",
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: TextStyle(
fontFamily: fontFamilyPoppins,
fontWeight: FontWeight.w400,
color: Colors.black38,
fontSize: 12.sp,
),
),
],
),
),
Icon(Icons.more_vert_outlined)
],
),
),
),
),
],
),
Step 7: Let’s see full code of our main.dart file.
import 'package:flutter/material.dart';
import 'package:on_audio_query/on_audio_query.dart';
void main() {
runApp(
MaterialApp(
home: SongList(),
),
);
}
class SongList extends StatefulWidget {
const Songs({Key? key}) : super(key: key);
@override
_SongListState createState() => _SongListState();
}
class _SongListState extends State<SongList> {
List<SongModel> allSongList = [];
final OnAudioQuery _audioQuery = OnAudioQuery();
bool isLoading = true;
@override
void initState() {
super.initState();
getAllSongList();
}
getAllSongList() async {
allSongList = await _audioQuery.querySongs();
setState(() {
isLoading = false;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: null,
// backgroundColor: Colors.black12,
body: isLoading
? CircularProgressIndicator()
: ListView(
children: [
for (var i = 0; i < allSongList.length; i++)
Container(
key: ValueKey(allSongList[i]),
child: Padding(
padding: EdgeInsets.all(8.0),
child: Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
QueryArtworkWidget(
id: allSongList[i].id,
type: ArtworkType.AUDIO,
nullArtworkWidget: Container(
height: 50.h,
width: 50.w,
padding: const EdgeInsets.all(4),
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.black,
image: DecorationImage(
image: AssetImage(blackLogoIcon),
),
),
),
),
SizedBox(width: 10.w),
Expanded(
flex: 3,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(
"${allSongList[i].title}",
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: TextStyle(
fontFamily: fontFamilyPoppins,
fontWeight: FontWeight.w600,
fontSize: 14.sp,
),
),
SizedBox(height: 2),
Text(
"${allSongList[i].artist}",
overflow: TextOverflow.ellipsis,
maxLines: 1,
style: TextStyle(
fontFamily: fontFamilyPoppins,
fontWeight: FontWeight.w400,
color: Colors.black38,
fontSize: 12.sp,
),
),
],
),
),
Icon(Icons.more_vert_outlined)
],
),
),
),
),
],
),
);
}
}
All Done!!
So that’s how you can get all the audio details from your local storage into your flutter application using “on_audio_query: any” package.
Hope you like this article. If you have any doubts or questions do comment.
See you in the Next Article.
