[英]Flutter: all Widget should arranged vertically in container
I want to arrange all items vertically in the container, I have taken in a row and as wells as in column but unable to arrange vertically like Linear Layout
vertical orientation. 我想将所有项目垂直排列在容器中,我已经在行中以及列中进行了排列,但是无法像Linear Layout
垂直方向那样垂直排列。
void main() {
runApp(new MaterialApp(
title: "My Demooo2",
home: new MyScaffold(),
));
}
class MyBar extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Container(
height: 90.0,
margin: new EdgeInsets.symmetric(vertical: 20.0),
padding: new EdgeInsets.all( 8.0),
decoration: new BoxDecoration(color: Colors.blue[100]),
child: new Row(
children: <Widget>[
new IconButton(icon: new Icon(Icons.adjust), onPressed: null),
new IconButton(icon: new Icon(Icons.disc_full), onPressed: null),
new IconButton(icon: new Icon(Icons.scatter_plot), onPressed: null),
new IconButton(icon: new Icon(Icons.delete_forever), onPressed: null),
new Text("test")
],
),
);
}
}
class MyScaffold extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Material(
child: new Column(
children: <Widget>[
new MyBar(),
new Expanded(
child: new Center(
child: new Text("My Center"),
))
],
),
);
}
}
I don't know you exact layout requirement - If i Understood your Question - Try this Code: 我不知道您的确切布局要求-如果我理解您的问题-请尝试以下代码:
class MyBar extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Container(
// height: 90.0,
margin: new EdgeInsets.symmetric(vertical: 20.0),
padding: new EdgeInsets.all( 8.0),
decoration: new BoxDecoration(color: Colors.blue[100]),
child: new Column(
children: <Widget>[
new IconButton(icon: new Icon(Icons.adjust), onPressed: null),
new IconButton(icon: new Icon(Icons.disc_full), onPressed: null),
new IconButton(icon: new Icon(Icons.scatter_plot), onPressed: null),
new IconButton(icon: new Icon(Icons.delete_forever), onPressed: null),
new Text("test")
],
),
);
}
}
class MyScaffold extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Material(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new MyBar(),
new Expanded(
child: new Center(
child: new Text("My Center"),
))
],
),
);
}
}
Output: 输出:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.