Reputation: 470
I'm developing an app using Flutter. I need to show a dialog box once a certain condition is fulfilled. When it's fulfilled, the dialog box is not shown, but the screen is dimmed as if the dialog box is being shown.
showEndGamePopUp() {
showDialog<void>(
context: context,
builder: (_) {
return Container(
child: SimpleDialog(
backgroundColor: Colors.black,
elevation: 2.0,
title: Text(
"$playerTurn wins!",
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
height: 1.5,
),
),
children: <Widget>[
SimpleDialogOption(
onPressed: () => Navigator.pop(context),
child: Text("Play again"),
),
SimpleDialogOption(
onPressed: () => exit(0),
child: Text("Exit"),
),
],
),
);
},
);
}
And I get the following exception: RenderBox was not laid out: RenderCustomPaint#3d792 relayoutBoundary=up3 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UP
.
Upvotes: 0
Views: 709
Reputation: 14305
showEndGamePopUp(BuildContext context) {
showDialog<void>(
context: context,
builder: (_) {
return Container(
child: SimpleDialog(
backgroundColor: Colors.black,
elevation: 2.0,
title: Text(
"wins!",
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
height: 1.5,
),
),
children: <Widget>[
new FlatButton(
onPressed: () => Navigator.of(context).pop(false),
child: new Text("Play again",
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
height: 1.5,
))),
new FlatButton(
onPressed: () {
Navigator.of(context).pop(true);
},
child: new Text("Exit",
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
height: 1.5,
)))
],
),
);
},
);
}
Upvotes: 0
Reputation: 61
The Problem is you use Expanded
I fix your Code.Here it is.
showEndGamePopUp() {
showDialog<void>(
context: context,
builder: (_) {
return Container(
child: SimpleDialog(
backgroundColor: Colors.red,
elevation: 2.0,
title: Text(
"wins!",
style: TextStyle(
color: Colors.white,
fontSize: 20.0,
height: 1.5,
),
),
children: <Widget>[
Row(children: <Widget>[
Expanded(
child: SimpleDialogOption(
onPressed: () => Navigator.pop(context),
child: Text("Play again"),
)),
]),
Row(
children: <Widget>[
Expanded(
child: SimpleDialogOption(
onPressed: () => print(0),
child: Text("Exit"),
),
)
],
),
],
),
);
},
);
}
Just use Row
wrap your Expanded
.
If you like, you can use Column
wrap Expanded
.
Expanded
must be placed directly inside flex widget.
Upvotes: 1