onyxsio_grid_view 1.0.4

Provides a Flutter grid layout. That supports multiple columns with rows of varying sizes.

Onyxsio Grid View

Provides a Flutter grids layout.

Getting started

In the pubspec.yaml of your flutter project, add the following dependency:

dependencies:
  onyxsio_grid_view: <latest_version>

In your library add the following import:

import 'package:onyxsio_grid_view/onyxsio_grid_view.dart';

For help getting started with Flutter, view the online documentation.

Features

This layout facilitates the browsing of uncropped peer content. Container heights are sized based on the widget size.

UI

Usage

Below you'll find the code to create this grid layout:

      OnyxsioGridView.builder(
        padding: const EdgeInsets.all(8),
        itemCount: 20,
        physics: const BouncingScrollPhysics(),
        staggeredTileBuilder: (index) => const OnyxsioStaggeredTile.fit(2),
        crossAxisCount: 4,
        mainAxisSpacing: 10,
        crossAxisSpacing: 10,
        shrinkWrap: true,
        itemBuilder: (context, index) => OnyxsioGridTile(
          index: index,
          heightList: const [300, 220, 220, 520],
          child: Container(color: Colors.blue),
        ),
      )

Optional information

staggeredTileBuilder: (index) =>
  OnyxsioStaggeredTile.count(2, index.isEven ? 2 : 1),

Optional information

staggeredTileBuilder: (index) =>
  OnyxsioStaggeredTile.extent(2, index.isEven ? 200 : 50),

Additional information

I'm working on my packages on my free-time, but I don't have as much time as I would. If this package or any other package I created is helping you, please consider to sponsor me so that I can take time to read the issues, fix bugs, merge pull requests and add features to these packages.

Contributions

Feel free to contribute to this project.

If you find a bug or want a feature, but don't know how to fix/implement it, please fill an issue.
If you fixed a bug or implemented a feature, please send a pull request.