如何使用颤振实现水平图标列表菜单



基本上我想实现如下的东西,

  • 手机右上角有一个菜单按钮。 如果用户单击它,水平条(如Android手机中的谷歌搜索栏(将在左侧打开,其中包含水平滚动图标的列表。

颤振中是否已经存在任何现有的小部件? 请让我知道如何开发此功能

以下是我认为您想要实现的示例:

bool showHorizontalBar = false;
Widget buildBarItem(IconData icon) {
return Container(
width: 100.0,
margin: EdgeInsets.all(4.0),
color: Colors.white,
child: Icon(icon),
);
}
Widget buildBar() {
return SizedBox(
height: 50.0,
child: ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
buildBarItem(Icons.directions_car),
buildBarItem(Icons.directions_bike),
buildBarItem(Icons.directions_bus),
buildBarItem(Icons.directions_run),
buildBarItem(Icons.directions_railway),
],
),
);
}
Widget buildMenuIcon() {
return IconButton(
icon: Icon(showHorizontalBar ? Icons.close : Icons.menu),
onPressed: () {
setState(() {
showHorizontalBar = !showHorizontalBar;
});
},
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Stack(
children: <Widget>[
showHorizontalBar ? buildBar() : SizedBox.shrink(),
Align(
alignment: Alignment.topRight,
child: buildMenuIcon(),
)
],
),
),
);
}

您可以使用listview水平显示图标

ListView(scrollDirection:Axis.horizontal,
children:[.. Icon(Icons.home).... ])

最新更新