Flutter Widget之GridView

Widget:https://flutter.io/docs/development/ui/widgets
GridView:https://docs.flutter.io/flutter/widgets/GridView-class.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
import 'package:flutter/material.dart';

class GridViewDemoPage extends StatefulWidget {
@override
State<StatefulWidget> createState() => new _GridViewDemoPageState();
}

class _GridViewDemoPageState extends State<GridViewDemoPage> {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(title: new Text('GridView Page Demo'),),
body: new Center(
child: buildGrid(),
),
);
}

List<Container> _buildGridTileList(int count) {
return new List<Container>.generate(count, (int index) =>
new Container(child: new Image.asset('images/pic${index + 1}.jpg'),));
}

// Widget buildGrid() {
// return new GridView.extent(
// maxCrossAxisExtent: 150.0,
// padding: const EdgeInsets.all(4.0),
// mainAxisSpacing: 4.0,
// crossAxisSpacing: 4.0,
// children: _buildGridTileList(18),);
// }

Widget buildGrid() {
var countGrid = GridView.count(
crossAxisCount: 2,
mainAxisSpacing: 4.0,
crossAxisSpacing: 4.0,
padding: const EdgeInsets.all(4.0),
childAspectRatio: 1.3,
children: _buildGridTileList(18),
);
return countGrid;
}

}

Flutter Widget GridView

Flutter Widget GridView

Powered by AppBlog.CN     浙ICP备14037229号

Copyright © 2012 - 2020 APP开发技术博客 All Rights Reserved.

访客数 : | 访问量 :