Make GridView child's height wrap by its content

return Container( height: 100, child: GridView.count( primary: false, crossAxisCount: defaultItemCount, mainAxisSpacing: 0, childAspectRatio: _childAspectRatio, physics: NeverScrollableScrollPhysics(), children: _createChildItemList(data.gridItem), ));

Its the usual way to create a gridview.
But what makes me confused is the child item's height of the gridview is not determined by the child height.Its measured by the childAspectRatio. Is there any way to make child's height wrap by its content?

I agree.

I solved this for now by doing the following in Widget build(BuildContext context):

var maxWidth = 500.0;
var width = MediaQuery.of(context).size.width;
var columns = (width ~/ maxWidth) + 1;
var columnWidth = width / columns;
//136 is the height of one grid item
var aspectRatio = columnWidth / 136;

SliverGrid(
   gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
      maxCrossAxisExtent: maxWidth, childAspectRatio: aspectRatio),
   delegate: (...)

I agree.

I solved this for now by doing the following in Widget build(BuildContext context):

var maxWidth = 500.0;
var width = MediaQuery.of(context).size.width;
var columns = (width ~/ maxWidth) + 1;
var columnWidth = width / columns;
//136 is the height of one grid item
var aspectRatio = columnWidth / 136;

SliverGrid(
   gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
      maxCrossAxisExtent: maxWidth, childAspectRatio: aspectRatio),
   delegate: (...)

Yes.I handle this just like u.

I agree.

I solved this for now by doing the following in Widget build(BuildContext context):

var maxWidth = 500.0;
var width = MediaQuery.of(context).size.width;
var columns = (width ~/ maxWidth) + 1;
var columnWidth = width / columns;
//136 is the height of one grid item
var aspectRatio = columnWidth / 136;

SliverGrid(
   gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
      maxCrossAxisExtent: maxWidth, childAspectRatio: aspectRatio),
   delegate: (...)

but sometime we can't measure the height of grid item [cry]

Same issue.

Closing as a duplicate of #97544. Please follow progress in that issue.

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Navigation Menu

Repository navigation

Make GridView child's height wrap by its content #29035

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Make GridView child's height wrap by its content #29035

Description

Activity

cirediew commented on May 7, 2019

SixSheeppp commented on May 8, 2019

kutear commented on Mar 23, 2021

pourqavam commented on Nov 29, 2021

Piinks commented on Jul 11, 2022

github-actions commented on Jul 25, 2022

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions