supergrid 1.0.4 copy "supergrid: ^1.0.4" to clipboard
supergrid: ^1.0.4 copied to clipboard

A customizable Flutter package for displaying grid views of sections.Includes three main widgets SimpleGridView A basic grid view with simple customization options. FlatGridView A grid view with more [...]

supergrid is Deprecated #

As of Dec. 21, 2023, supergrid is deprecated and there will be no further releases.

Please use flutter_super_grid instead: https://pub.dev/packages/flutter_super_grid

about supergrid #

A customizable Flutter package for displaying grid views of sections with additional features.

Installation #

Add the following to your pubspec.yaml file:

dependencies:
  supergrid: ^1.0.0

Then, run:

$ flutter pub get

Features #

  • Customizable grid view with sections and various configuration options.
  • Support for item tap callbacks with section and item indices.
  • Option to invert the row and display the grid horizontally.
  • Section titles with customizable styling and alignment.

Usage #

SimpleGridView #

import 'package:supergrid/simplegrid.dart';



SimpleGridView(
  data: yourDataList,
  renderItem: (itemData) {
    // Customize how each item is rendered
    return YourCustomItemWidget(itemData);
  },
  itemWidth: 150.0,
  itemHeight: 200.0,
  color: Colors.blue,
  padding: EdgeInsets.all(16.0),
  gridViewPadding: EdgeInsets.all(8.0),
  verticalSpacing: 10.0,
  horizontalSpacing: 10.0,
  horizontal: false,
  invertedRow: false,
)

FlatGridView #

import 'package:supergrid/flatgrid.dart';


FlatGridView(
  data: yourDataList,
  renderItem: (itemData) {
    // Customize how each item is rendered
    return YourCustomItemWidget(itemData);
  },
  itemWidth: 150.0,
  itemHeight: 200.0,
  color: Colors.blue,
  padding: EdgeInsets.all(16.0),
  gridViewPadding: EdgeInsets.all(8.0),
  verticalSpacing: 10.0,
  horizontalSpacing: 10.0,
  horizontal: false,
  invertedRow: false,
  onPressed: (index) {
    // Handle item tap
  },
)

SectionGridView #

import 'package:supergrid/sectiongrid.dart';

SectionGridView(
  sections: yourSectionsList,
  renderItem: (itemData) {
    // Customize how each item is rendered
    return YourCustomItemWidget(itemData);
  },
  itemWidth: 150.0,
  itemHeight: 200.0,
  color: Colors.blue,
  padding: EdgeInsets.all(16.0),
  gridViewPadding: EdgeInsets.all(8.0),
  verticalSpacing: 10.0,
  horizontalSpacing: 10.0,
  invertedRow: false,
  onPressed: (sectionIndex, index) {
    // Handle item tap
  },
  titleAlignment: TitleAlignment.start,
  titleBackgroundColor: Colors.transparent,
  titlePadding: EdgeInsets.all(8.0),
  titleTextStyle: TextStyle(
    fontWeight: FontWeight.normal,
    fontSize: 16,
    color: Colors.black,
  ),
)

Configuration #

  • data: The data to display in the flatgrid or simplegrid.
  • sections: The sections to be displayed on the sectiongrid.
  • renderItem: The function that renders each item in the grid.
  • itemWidth: The width of each grid item.
  • itemHeight: The height of each grid item.
  • color: Background color of the grid container.
  • padding: Padding around the grid container.
  • gridViewHeight: Height of the internal GridView.
  • gridViewWidth: Width of the internal GridView.
  • gridViewPadding: Padding for the internal GridView.
  • verticalSpacing: Spacing between grid items vertically.
  • horizontalSpacing: Spacing between grid items horizontally.
  • horizontal: Whether the grid view is horizontal.
  • invertedRow: Whether to invert the row.
  • onPressed: Callback when an item is tapped.
  • titleAlignment: Alignment of the section title. (Default is TitleAlignment.start)
  • titleBackgroundColor: Background color of the section title container. (Default is Colors.transparent)
  • titlePadding: Padding around the section title. (Default is EdgeInsets.all(8.0))
  • titleTextStyle: Style of the section title text. (Default is a basic text style)

Documentation #

For detailed documentation, see API Documentation.

License #

This project is licensed under the MIT License - see the LICENSE.md file for details.

Issues and Contributions #

If you encounter any issues or have suggestions for improvements, please open an issue on the GitHub repository. Contributions and pull requests are welcome!

3
likes
130
points
17
downloads

Publisher

verified publisherotrofy.com

Weekly Downloads

A customizable Flutter package for displaying grid views of sections.Includes three main widgets SimpleGridView A basic grid view with simple customization options. FlatGridView A grid view with more advanced configuration options. SectionGridView A grid view with support for sections and additional styling options.

Documentation

API reference

License

BSD-3-Clause (license)

Dependencies

flutter

More

Packages that depend on supergrid