ResponsiveGrid class

A grid widget that auto-adjusts column count based on device type.

Eliminates the need to manually call responsiveValue() for grid columns.

ResponsiveGrid(
  mobileColumns: 2,
  tabletColumns: 3,
  desktopColumns: 4,
  spacing: 16,
  children: products.map((p) => ProductCard(product: p)).toList(),
)
Inheritance
Available extensions

Constructors

ResponsiveGrid({Key? key, required List<Widget> children, int mobileColumns = 1, int? tabletColumns, int? desktopColumns, int? widescreenColumns, double spacing = 8, double runSpacing = 8, double childAspectRatio = 1.0, EdgeInsets? padding, bool shrinkWrap = false, ScrollPhysics? physics})
const

Properties

childAspectRatio double
Width / height ratio of each grid cell (default: 1.0).
final
children List<Widget>
The grid's children.
final
desktopColumns int?
Number of columns on desktop. Falls back to tabletColumns ?? mobileColumns.
final
hashCode int
The hash code for this object.
no setterinherited
key Key?
Controls how one widget replaces another widget in the tree.
finalinherited
mobileColumns int
Number of columns on mobile (required).
final
padding EdgeInsets?
Optional padding around the grid.
final
physics ScrollPhysics?
Optional scroll physics.
final
runSpacing double
Vertical spacing between grid items (default: 8).
final
runtimeType Type
A representation of the runtime type of the object.
no setterinherited
shrinkWrap bool
Whether the grid should shrink-wrap its content (default: false).
final
spacing double
Horizontal spacing between grid items (default: 8).
final
tabletColumns int?
Number of columns on tablet. Falls back to mobileColumns if null.
final
widescreenColumns int?
Number of columns on widescreen. Falls back to desktopColumns chain.
final

Methods

adaptiveConstrained(BuildContext context) Widget

Available on Widget, provided by the ResponsiveConstraints extension

Responsive constraint based on device type, using config-driven max widths.
build(BuildContext context) Widget
Describes the part of the user interface represented by this widget.
override
constrained({double maxWidth = 800}) Widget

Available on Widget, provided by the ResponsiveConstraints extension

Centers the widget and ensures its width does not exceed maxWidth.
constrainedBoth({double maxWidth = 800, double maxHeight = 600}) Widget

Available on Widget, provided by the ResponsiveConstraints extension

Constrains widget with both max width and height.
createElement() StatelessElement
Creates a StatelessElement to manage this widget's location in the tree.
inherited
debugDescribeChildren() List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a one-line detailed description of the object.
inherited
toStringShort() String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) bool
The equality operator.
inherited