Document that rebuilding the Scaffold doesn't rebuild its BottomSheet #2115
Description
In the example app below the values of the bottom sheet checkboxes are reflected in the application's ToolBar.
The checkbox onChanged() callbacks can't rely on just calling setState() because rebuilding the Scaffold doesn't cause its bottom sheet to be rebuilt.
The two onChanged() callbacks demo how one can handle this. Neither of them is super-obvious.
It might be better to change Scaffold to always rebuild its bottom sheets.
Note also: the checkbox0 approach was lifted from list_demo.dart. The checkbox1 approach comes from stock_menu.dart.
import 'package:flutter/material.dart';
class DrawBottomSheet extends StatefulComponent {
DrawBottomSheet({ Key key }) : super(key: key);
DrawBottomSheetState createState() => new DrawBottomSheetState();
}
class DrawBottomSheetState extends State<DrawBottomSheet> {
final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
ScaffoldFeatureController _bottomSheet;
bool _checkboxValue0 = false;
bool _checkboxValue1 = false;
void showBottomSheet() {
_bottomSheet = _scaffoldKey.currentState.showBottomSheet((_) {
return new Container(
decoration: new BoxDecoration(
border: new Border(top: new BorderSide(color: Colors.black26, width: 1.0))
),
child: new Padding(
padding: const EdgeDims.all(32.0),
child: new Column(
justifyContent: FlexJustifyContent.collapse,
children: <Widget>[
new ListItem(
primary: new Text('ScaffoldFeatureController'),
right: new Checkbox(
value: _checkboxValue0,
onChanged: (bool value) {
setState(() {
_checkboxValue0 = value;
});
//This line causes the bottom sheet to be rebuilt:
_bottomSheet.setState(() { });
}
)
),
new ListItem(
primary: new Text('StatefulBuilder'),
right: new StatefulBuilder(
builder: (BuildContext context, StateSetter checkboxSetState) {
return new Checkbox(
value: _checkboxValue1,
onChanged: (bool value) {
setState(() {
_checkboxValue1 = value;
});
//This line causes the checkbox to be rebuilt:
checkboxSetState(() { });
}
);
}
)
)
]
)
)
);
});
}
Widget build(BuildContext context) {
return new Scaffold(
key: _scaffoldKey,
toolBar: new ToolBar(center: new Text("Checkboxes: $_checkboxValue0, $_checkboxValue1")),
body: new Center(
child: new RaisedButton(
onPressed: showBottomSheet,
child: new Text('Show BottomSheet')
)
)
);
}
}
void main() {
runApp(new MaterialApp(
title: 'Draw BottomSheet',
routes: <String, RouteBuilder>{
'/': (RouteArguments args) => new DrawBottomSheet(),
}
));
}