【发布时间】:2020-06-28 23:37:39
【问题描述】:
我是 Flutter 的新手,正在尝试构建一个响应式 Web 应用程序。到目前为止,我工作的代码是当屏幕宽度缩小到一定大小时,导航栏及其项目被压缩成一个菜单图标按钮(Flutter 的 IconButton)。这行得通。不起作用的是,当我单击 IconButton 时,新的导航栏不会弹出,即使控制台显示我正在单击它。 DrawerItem() 只是一个包装在容器中的文本小部件。在几段代码之后,您可以看到控制台吐出响应。当我调整屏幕大小或单击图标按钮时,屏幕或控制台中没有任何错误。我还尝试使 MNavigationBar 成为有状态的小部件并将 setState 添加到 onPressed 属性,当前问题没有任何变化,并且发生了同样的事情。
class MNavigationBar extends StatelessWidget {
const MNavigationBar({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
height: 80,
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
IconButton(
icon: Icon(
Icons.menu,
),
onPressed: () {
NavigationDrawer();
print('Menu Icon pressed');
},
),
NavBarLogo(),
],
),
);
}
}
class NavigationDrawer extends StatelessWidget {
const NavigationDrawer({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Container(
width: 260,
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
color: Colors.black,
blurRadius: 16,
),
],
),
child: Column(
children: <Widget>[
NavigationDrawerHeader(),
DrawerItem('Home'),
DrawerItem('Events'),
NavBarMenuDropdown(),
DrawerItem('Store'),
DrawerItem('Partners'),
DrawerItem('About Us'),
],
),
);
}
}
Performing hot restart... 148ms
Restarted application in 149ms.
Menu Icon pressed
Menu Icon pressed
【问题讨论】:
-
on press 函数下的 NavigationDrawer() 行只是创建 NavgationDrawer 无状态小部件的实例。您没有在任何地方绘制小部件。您应该将 Navigation Drawer 设置为基础 Scaffold 小部件中的抽屉属性,然后在 onPressed 函数中使用 Scaffold.of(context).openDrawer()
-
@AfridiKayal 在下面查看我的代码更改。你的建议奏效了。谢谢!
标签: flutter