I am building an MusicPlayer app So I need to view list of musicTiles so user can select song from internal storage and play it. So I used File_Picker in appbar through add button from which user can pick up music from their local storage. So I used async and await keyword in my file_picking function. and i store the file_path and file_names in the List type of variables. After that I used my _buidMusicTile() function in my column widget but it flutter gives following Error :
=> type 'Future' is not a subtype of type 'Widget'
Code :
class _MusicPageState extends State<MusicPage> {
FileType _pickingType = FileType.any;
TextEditingController _controller = TextEditingController();
List<String> listofAudioFilesPath;
List<String> listofAudioNames;
@override
void initState() {
super.initState();
_controller.addListener(() => _extension = _controller.text);
}
@override
Widget build(BuildContext context) {
Size size = MediaQuery.of(context).size;
//const Key centerKey = ValueKey('bottom-sliver-list');
return Scaffold(
backgroundColor: Colors.brown[300],
appBar: AppBar(
actions: [
Container(
width: size.width,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
IconButton(
icon: Icon(Icons.sort),
onPressed: () {},
),
IconButton(
icon: Icon(Icons.add_circle),
onPressed: () async {
// _openFileExplorer();
FilePickerResult result = await FilePicker.platform
.pickFiles(allowMultiple: true);
if (result != null) {
listofAudioFilesPath = result.paths.toList();
listofAudioNames = result.names.toList();
print(listofAudioNames);
print(listofAudioFilesPath);
}
},
),
],
),
),
),
],
),
body: Column(
children: [
Text('Music Library'),
SizedBox(height: 10),
Stack(
children: [
_buildMusicTile(listofAudioFilesPath, listofAudioNames),
],
),
],
),
);
}
}
_buildMusicTile(
List<String> listofAudioFilesPath, List<String> listofAudioNames) async {
List<String> listOfPath = await listofAudioFilesPath;
List<String> listOfFiles = await listofAudioFilesPath;
if (listofAudioFilesPath != null && listofAudioNames != null) {
return ListView.separated(
itemCount: listofAudioNames.length,
separatorBuilder: (BuildContext context, int index) {
return Container(
height: 10,
color: Colors.white,
);
},
itemBuilder: (BuildContext context, int index) {
return ListTile(
leading: Icon(Icons.play_circle_filled),
title: Text(
'$listofAudioNames[$index]',
style: TextStyle(color: Colors.black, fontSize: 25),
),
);
},
);
} else {
return Center(
child: Column(
children: [
Text(
'$listofAudioNames',
style: TextStyle(color: Colors.black, fontSize: 25),
),
CircularProgressIndicator(),
],
),
);
}
}
You can't use
await
inside the body or method which called from the body because that need to render on the screen, UI cannot wait for any data, we need to update that.Solution:
Just remove
await
andasync
from method_buildMusicTile
likeAnd add
setState()
insideonPressed()