dart - Flutter Bottom Sheet:当用户与工作表交互时如何改变高度
问题描述
在我的颤振应用程序中,我有一个底部工作表,显示初始高度为 100。当用户与其交互时,我想增加工作表的高度(比如可能是 500 或全屏显示)(可能是手势检测或单击工作表上的按钮)
是否可以在加载后更改纸张的高度。
我的底页类似于
Widget _bottomSheetContainer(BuildContext context) {
return Container(
height: 100,
decoration: BoxDecoration(
border:
Border(top: BorderSide(color: Theme.of(context).dividerColor))),
child: Row(children: [
Expanded(
child: Padding(
padding: EdgeInsets.all(10.0),
child: Text('Some text here!'),
)
),
Expanded(
child: IconButton(
icon: Icon(Icons.arrow_upward),
// color: themeData.primaryColor,
onPressed: () => _onPressed(context)
),
),
]));
}
_onPressed(BuildContext context) {
BottomSheet w = context.widget;
// Can we change the container height (from 100 to 500) that's part of the bottom sheet from here?
}
解决方案
您需要确保您的小部件是有状态的小部件,然后您可以使用更新它的实例参数setState(() => ...)
,并且颤振将更新渲染结果。
class _WidgetState extends State<Widget> {
double height = 200.0; // starting height value
Widget build() {
<...>
Container(
height: height,
<...>
}
_onPressed(BuildContext context) {
BottomSheet w = context.widget;
// Can we change the container height (from 100 to 500) that's part of the bottom sheet from here?
setState({
height = 300.0; // new height value
})
}
}