title: Flutter Auto Resizing Grid Cards based on Screen Size
body: <p>I am using the below code to display Cards in a Grid and it works fine.</p>
  
  <pre><code>return new GridView.count(
    primary: false,
    padding: const EdgeInsets.all(1.5),
    crossAxisCount: 2,
    childAspectRatio: 0.80,
    mainAxisSpacing: 1.0,
    crossAxisSpacing: 1.0,
    children: _loadCategories(), //new Cards()
    shrinkWrap: true,
  );
  </code></pre>
  
  <p>Currently the display is as below in Landscape and Portrait.</p>
  
  <p><a href="https://i.stack.imgur.com/xnG2w.png" rel="noreferrer"><img src="https://i.stack.imgur.com/xnG2w.png" alt="Portrait"></a></p>
  
  <p><a href="https://i.stack.imgur.com/EVrYG.png" rel="noreferrer"><img src="https://i.stack.imgur.com/EVrYG.png" alt="Landscape"></a></p>
  
  <p>But I want all the Grid/Cards(6 in this case) to fill the view port fully. All the 6 Cards should be visible in the view port. Currently the last 2 Cards are below the view port in Portrait and 4 cards are below in the Landscape mode.</p>
  
  <p>How can I make all the cards to reshape based on the screen size?</p>
  
  <p><strong>Just Curious on below:</strong></p>
  
  <p>Is it possible to make the grid responsive instead of having fixed items in a row?</p>
  
  <p>EIDT 1:</p>
  
  <p>I am using the below Card 6 times to generate the below content.</p>
  
  <pre><code>  List&lt;Widget&gt; _loadCategories() {
      List&lt;Widget&gt; categoryCells = [];
      List&lt;CategoryItem&gt; categories = new CategoryManager().categories();
  
      for (CategoryItem category in categories) {
        categoryCells.add(getStructuredGridCell(category));
      }
  
      return categoryCells;
    }
  
    Card getStructuredGridCell(CategoryItem item) {
      return new Card(
        elevation: 2.0,
        color: item.color,
        child: new InkWell(
          highlightColor: Colors.white.withAlpha(30),
          splashColor: Colors.white.withAlpha(20),
          child: new Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisSize: MainAxisSize.min,
              verticalDirection: VerticalDirection.down,
              children: &lt;Widget&gt;[
                new Image(image: new AssetImage(item.iconUri)),
                new Center(
                  child: new Text(item.title),
                )
              ]),
          onTap: () {
            _tappedCategoryCell(item.routeName);
          },
        ),
      );
    }
  </code></pre>