我正在尝试创建一个自定义小部件,它是一个包含3个iconButtons的圆角矩形,用于导航。但是,就我所见,iconButtons不能在材质小部件之外使用,我不知道如何将它们包装在不会弄乱我的UI的小部件中。
这是我的一段代码,只是容器中的一个图标。在关闭窗口小部件之前,代码会以不同的图标和onPressed重复两次。我真的希望我的UI看起来我的计划,以及这些按钮的工作。
@override
Widget build(BuildContext context) {
return Container(
height: 50.0,
width: 200.0,
// color: Colors.grey[800],
decoration: new BoxDecoration(
color: Colors.grey[800],
borderRadius: new BorderRadius.all( Radius.circular(50.0)),
),
child: Stack(
children: <Widget>[
Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new Container(
child: Column(
mainAxisSize: MainAxisSize.max,
children: <Widget>[
IconButton(
icon: Icon(Icons.menu),
color: Colors.white,
onPressed: () {
print('test');
},
) // IconButton
], // <Widget>[]
) //Column
), // Container
将您的代码包装在Scaffold
中它会起作用。
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Container(
height: 50.0,
width: 200.0,
decoration: BoxDecoration(
color: Colors.grey[800],
borderRadius: new BorderRadius.all(Radius.circular(50.0)),
),
child: Stack(
children: [
Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Container(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
IconButton(
icon: Icon(Icons.menu),
color: Colors.white,
onPressed: () {
print('test');
},
)
],
),
)
],
),
)
],
),
),
); // IconButton ], // [] ) //Column ), // Container
}