Issue
This question seems silly but i really wonder why i cant wrap this Future Builder in a column.
The Widget is called inside a scaffold. What am I doing wrong? I tried to wrap it in a ListView and some other widgets too. It works perfectly if the build method returns the FutureBuilder which returns different widgets depending on the outcome.
If the build method returns another widget with the FutureBuilder as an child or in a array of widgets (children) there is only a white screen.
The IDE is not showing any errors and the debug console either. thx for help!
EDIT: Got an error!
Error: Cannot hit test a render box with no size.
class _CampsiteOverviewScreenState extends State<CampsiteOverviewScreen> {
CampsiteState campsiteState = CampsiteState();
@override
Widget build(BuildContext context) {
return FutureBuilder(
future: campsiteState.read(), // async work
builder: (BuildContext context, AsyncSnapshot snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.waiting:
return CircularProgressIndicator();
default:
if (snapshot.hasError)
return Text('Error: ${snapshot.error}');
else
return _buildListView(snapshot);
}
},
);
}
Widget _buildListView(AsyncSnapshot snapshot) {
return Container(
child: ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return Card(
margin: EdgeInsets.all(10),
child: ListTile(
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => CampsiteDetailScreen(
campsiteState: campsiteState,
campsite: snapshot.data[index]))).then((value) {
if (value != null) {
setState(() {});
}
});
},
contentPadding: EdgeInsets.only(right: 30, left: 36),
title: Text(snapshot.data[index].name),
trailing: Text(snapshot.data[index].address),
),
);
},
),
);
}
}
Full error output:
Error: Cannot hit test a render box with no size. The hitTest() method was called on this RenderBox: RenderRepaintBoundary#9bbe1 relayoutBoundary=up1 NEEDS-PAINT: needs compositing creator: RepaintBoundary ← NotificationListener ← NotificationListener ← _MaterialScrollbar ← Scrollbar ← Scrollable ← PrimaryScrollController ← ListView ← Container ← FutureBuilder<List> ← Column ← CampsiteOverviewScreen ← ⋯
Solution
I already found the solution because of the new error msg which appeared. I just needed to wrap the Future Builder in a (new) Expanded() widget. like this:
In case anybody knows why this would be really interesting.
Expanded( child: FutureBuilder(...)),
@override
Widget build(BuildContext context) {
return Column(
children: [
ElevatedButton(
onPressed: (() => {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) =>
AddCampsite(campsiteState: campsiteState)))
}),
child: Text("Platz hinzufügen")),
Expanded(
child: FutureBuilder(
future: campsiteState.read(), // async work
builder: (BuildContext context, AsyncSnapshot snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.waiting:
return Center(
child: CircularProgressIndicator(
color: Colors.black87,
));
default:
if (snapshot.hasError)
return Text('Error: ${snapshot.error}');
else
return _buildListView(snapshot);
}
},
),
),
],
);
}
Answered By - Mike Keller
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.