Issue
I want build the layout that provided in the image and I had done that but I want Play all button also able to scroll as the Future list view builder. But I am unable to acheive that. I had used NEstedScrollView() wrap around DefaultTabController Widget
@override
Widget build(BuildContext context) {
return Container(
child: Column(
children: [
Padding(
padding: const EdgeInsets.only(top: 10, left: 10, right: 10),
child: Row(
children: [
AddButton(
icon: Icons.play_circle_outline_rounded,
buttonText: 'Play all',
onPressed: () {})
],
),
),
Expanded(
child: FutureBuilder(
future: GetPermissionAndSongs().getAvailableSongs(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
Widget leading;
Widget artworkAvailableWidget(dynamic snapshot) {
return CircleAvatar(
backgroundImage: MemoryImage(snapshot),
);
}
Widget artworkUnavailableWidget(dynamic snapshot) {
return CircleAvatar(
backgroundImage: AssetImage('images/happy_music.png'),
backgroundColor: Colors.grey.shade100,
);
}
Widget artworkLoadingWidget() {
return CircleAvatar(
child: CircularProgressIndicator(),
);
}
FlutterAudioQuery audioQuery = new FlutterAudioQuery();
if (snapshot.data == null) {
return Container(
child: Center(
child: CircularProgressIndicator(),
),
);
} else {
return ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return SongPlayCard(
imagePath: snapshot.data[index].songArtwork,
songPath: snapshot.data[index].songPath,
songName: snapshot.data[index].songName,
onPress: () {
SharedPreferences.getInstance().then((value) {
value.setStringList('last_Played', [
snapshot.data[index].songName,
snapshot.data[index].songPath,
snapshot.data[index].artistName,
snapshot.data[index].songId,
]);
});
changeName(
snapshot.data[index].songName,
snapshot.data[index].artistName,
snapshot.data[index].songPath,
snapshot.data[index].songId,
_leadingArtwork(leading),
);
},
artistName: snapshot.data[index].artistName,
leading: (snapshot.data[index].songArtwork == null)
? FutureBuilder<dynamic>(
future: audioQuery.getArtwork(
type: ResourceType.SONG,
id: snapshot.data[index].songId,
),
builder: (_, snapshot) {
if (snapshot.data == null) {
leading = artworkLoadingWidget();
return leading;
} else {
if (snapshot.data.isEmpty == false) {
print(snapshot.data);
leading = artworkAvailableWidget(
snapshot.data);
return leading;
} else {
leading = artworkUnavailableWidget(
snapshot.data);
return leading;
}
}
},
)
: null,
);
});
}
}),
),
FutureBuilder(
future: getLastPlayed(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
FlutterAudioQuery audioQuery = new FlutterAudioQuery();
if (snapshot.data == null) {
return FloatingPlayer(
songName: '',
songArtist: "",
);
} else {
if (snapshot.data.isEmpty == false) {
String songName =
(updatedName == "") ? snapshot.data[0] : updatedName;
String artistName = (updatedArtistName == "")
? snapshot.data[2]
: updatedArtistName;
String songPath = (updatedSongPath == "")
? snapshot.data[1]
: updatedSongPath;
return FutureBuilder(
future: GetPermissionAndSongs()
.getLastPlayedArtworks(snapshot.data[0]),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if (snapshot.data == null) {
return Center(
child: CircularProgressIndicator(),
);
} else {
return FloatingPlayer(
songName: songName,
iconData: iconData,
songArtist: artistName,
imagePath: snapshot.data[0].songArtwork,
onPlayOrPause: () {
playPause(songPath, null);
},
leading: (updatedLeadingArtwork == null)
? (leadingArtwork == null)
? (snapshot.data[0].songArtwork == null)
? FutureBuilder(
future: audioQuery.getArtwork(
type: ResourceType.SONG,
id: snapshot.data[0].songId),
builder: (_, snapshot) {
if (snapshot.data == null) {
leadingArtwork = CircleAvatar(
child:
CircularProgressIndicator(),
);
return leadingArtwork;
} else {
if (snapshot.data.isEmpty ==
false) {
leadingArtwork = CircleAvatar(
backgroundImage: MemoryImage(
snapshot.data),
);
return leadingArtwork;
} else {
leadingArtwork = CircleAvatar(
backgroundImage: AssetImage(
'images/happy_music.png'),
backgroundColor:
Colors.teal.shade600);
return leadingArtwork;
}
}
},
)
: null
: leadingArtwork
: updatedLeadingArtwork,
);
}
},
);
} else {
return FloatingPlayer(
songName: 'Last played unavailable',
songArtist: "",
);
}
}
},
),
],
),
);
}
Above code doesn’t help me. It expand the Future list view builder throughout the whole screen. How I make that scrollable too
Solution
One way of solving this would be to use a SingleChildScrollView and to set the physics of the ListView to ScrollPhysics()
SingleChildScrollView(
child: Column(
children: [
PlayAllButton(),
ListView(
//My List View Properties
physics: ScrollPhysics(),
),
),
),
)
Answered By – Bilal Naeem
Answer Checked By – Marie Seifert (FlutterFixes Admin)