title: Flutter GridView item wrap_content height
body: <p>I am an android developer and new to flutter.  </p>
  
  <p>I would like to create a <code>GridView</code> with <code>wrap content</code> item height (I draw it with pen in the screenshot). But I have tried with the following code and it gave me only square grid item. I would like how to get height wrap content grid item and I have no idea and can't find how to get it. Please help. Thank you.</p>
  
  <p><a href="https://i.stack.imgur.com/GmKhv.png" rel="noreferrer"><img src="https://i.stack.imgur.com/GmKhv.png" alt="enter image description here"></a></p>
  
  <pre><code>class CategoryItem extends StatelessWidget {
    final Category category;
    CategoryItem({Key key, @required this.category})
        : assert(category != null),
          super(key: key);
  
    @override
    Widget build(BuildContext context) {
      return Card(
        child: Text(
          category.name,
          style: TextStyle(fontSize: 34.0, fontWeight: FontWeight.bold),
        ),
        color: Colors.amberAccent,
      );
    }
  }
  
  
  class CategoryGrid extends StatefulWidget {
  
    final List&lt;Category&gt; items;
  
    const CategoryGrid({Key key, this.items}) : super(key: key);
  
    @override
    _CategoryGridState createState() =&gt; _CategoryGridState();
  }
  
  class _CategoryGridState extends State&lt;CategoryGrid&gt; {
  
    @override
    Widget build(BuildContext context) {
      final Orientation orientation = MediaQuery.of(context).orientation;
      return Column(
        children: &lt;Widget&gt;[
          Expanded(
            child: SafeArea(
              top: false,
              bottom: false,
              child: GridView.builder(
                itemCount: widget.items.length,
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: (orientation == Orientation.portrait) ? 2 : 3,),
                itemBuilder: (BuildContext context, int index) {
                  return CategoryItem(category: widget.items[index],);
                },
              ),
            ),
          ),
        ],
      );
    }
  }
  </code></pre>