How to create the static grid in flutter app

Grid is a layout design system to show items in a list.
Today we will learn that how can we create grid in any flutter app.
So Grid is just like a box that can be same size or different.
Lets check the example -

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Grid Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'FLutter Grid'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: new GridView.count(
        crossAxisCount: 4,
          children: [
            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 1'),
                )
            ),
            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 2'),
                )
            ),


            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 3'),
                )
            ),


            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 4'),
                )
            ),


            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 5'),
                )
            ),


            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 6'),
                )
            ),

            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 7'),
                )
            ),
            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 8'),
                )
            ),
            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 9'),
                )
            ),
            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 10'),
                )
            ),
            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 11'),
                )
            ),
            new Card(
                color: Colors.blue.shade200,
                child: new Center(
                  child: new Text('Tile 12'),
                )
            )
            
          ]
      ),
    );
  }
}

This is the demo code to create static grid in the app.
The output of this code will look like this -

Now if you want to change the background color of the tiles ( I have already write an article to change color or theme ) then just change the color key.

Lets get example-
Now I am going to change the background color of tiles.
So I need to change the  color: Colors.blue.shade200 to  color: Colors.green, or whatever you color want.

In the next article, we will learn how to create dynamic Grid in flutter.