class _home extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _homeState();
}
}
class _homeState extends State<_home> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: Text("title"),
centerTitle: true,
),
body: new GridView.count(
// padding: EdgeInsets.fromLTRB(8.0,0,8.0,0),//上下左右内边距
mainAxisSpacing: 4.0,//x轴间距
childAspectRatio: 1.5,//宽高比
crossAxisSpacing: 4.0,//y轴间距
crossAxisCount: 3,//行个数
children: <Widget>[
new Container(
color: Colors.deepPurpleAccent,
),
new Container(
color: Colors.yellow,
),
new Container(
color: Colors.lightBlue,
),
new Container(
color: Colors.grey,
),
new Container(
color: Colors.red,
),
new Container(
color: Colors.blueGrey,
),
],
)
);
}
}

效果图
另一种写法:
class _home extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _homeState();
}
}
class _homeState extends State<_home> {
@override
Widget build(BuildContext context) {
// TODO: implement build
return new Scaffold(
appBar: new AppBar(
title: Text("title"),
centerTitle: true,
),
body: new GridView(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
mainAxisSpacing: 4.0,
//x轴间距
childAspectRatio: 1.5,
//宽高比
crossAxisSpacing: 4.0,
//y轴间距
crossAxisCount: 3,
//行个数
),
children: <Widget>[
new Container(
color: Colors.deepPurpleAccent,
),
new Container(
color: Colors.yellow,
),
new Container(
color: Colors.lightBlue,
),
new Container(
color: Colors.grey,
),
new Container(
color: Colors.red,
),
new Container(
color: Colors.blueGrey,
),
],
)
);
}
效果一样

效果图
网友评论