A Flutter staggered grid view which supports multiple columns with rows of varying sizes.
- Configurable cross-axis count or max cross-axis extent like the GridView
- Tiles can have a fixed main-axis extent, or a multiple of the cell's length.
- Configurable main-axis and cross-axis margins between tiles.
- SliverStaggeredGrid for using in a CustomScrollView.
- Staggered and Spannable grid layouts.
- Tiles can fit the content in the main axis.
pubspec.yaml of your flutter project, add the following dependency:
dependencies: ... flutter_staggered_grid_view: "^0.2.7"
In your library add the following import:
For help getting started with Flutter, view the online documentation.
new StaggeredGridView.countBuilder( crossAxisCount: 4, itemCount: 8, itemBuilder: (BuildContext context, int index) => new Container( color: Colors.green, child: new Center( child: new CircleAvatar( backgroundColor: Colors.white, child: new Text('$index'), ), )), staggeredTileBuilder: (int index) => new StaggeredTile.count(2, index.isEven ? 2 : 1), mainAxisSpacing: 4.0, crossAxisSpacing: 4.0, )
You can find more examples in the Example project.
StaggeredGridView follow the same constructors convention than the GridView.
There are two more constructors:
extentBuilder. These constructors allow you to define a builder for the layout and a builder for the children.
A StaggeredGridView needs to know how to display each tile, and what widget is associated with a tile.
A tile needs to have a fixed number of cell to occupy in the cross axis. For the extent in the main axis you have 3 options:
- You want a fixed number of cells => use
- You want a fixed extent => use
- You want a variable extent, defined by the content of the tile itself => use
Please see the Changelog page to know what's recently changed.
Feel free to contribute to this project.
- Built-in types and core primitives for a Flutter application. [...]
- Support for asynchronous programming, with classes such as Future and Stream. [...]
- Classes and utilities that supplement the collection support in dart:core. [...]
- Encoders and decoders for converting between different data representations, including JSON and UTF-8. [...]
- Built-in types, collections, and other core functionality for every Dart program. [...]
- Interact with developer tools such as the debugger and inspector. [...]
- Mathematical constants and functions, plus a random number generator. [...]
- Lists that efficiently handle fixed sized data (for example, unsigned 8 byte integers) and SIMD numeric types. [...]
- File, socket, HTTP, and other I/O support for non-web applications. [...]
- Concurrent programming using isolates: independent workers that are similar to threads but don't share memory, communicating only via messages. [...]