How to create gridview with user input in flutter?

Question

I added text field for rows and columns for the user to input , now what should I specify in the set state of the button so that on clicking, it changes the grid according to the row and column user input.

TextEditingController row = TextEditingController();
  TextEditingController column = TextEditingController();

  int rowC = 2;
  int colC = 2;
.
.
Container(
                height: 300,
                child: Container(
                  padding: EdgeInsets.all(10),
                  child: GridView.builder(
                    gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: rowC,childAspectRatio: colC*rowC/2 ,crossAxisSpacing: 10,mainAxisSpacing: 10),
                    itemCount: 2,
                    itemBuilder: (ctx,index){
                      return Container(
                        margin: EdgeInsets.all(10),
                        child: RaisedButton(
                          onPressed: (){}
                            );
                          },
                          color: Colors.blue,
                          child: Text(index.toString()),
                        ),
             Card(
               elevation: 5,
               child: Container(
                 padding: EdgeInsets.all(10),
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.end,
                 children: <Widget>[
                   TextField(
                     controller: row,
                     decoration: InputDecoration(labelText: 'Row'),
                   ),
                   TextField(
                     controller: column,
                     decoration: InputDecoration(labelText: 'Column'),
                   ),
                   FlatButton(onPressed: (){
                     rowC = int.parse(row.text);
                     colC = int.parse(column.text);
                     setState(() {  
                     });
                   },
                       child: Text('Add'))
                 ],
         
 

Answer 1

class Class extends StatefulWidget {
  @override
  _ClassState createState() => _ClassState();
}

class _ClassState extends State<Class> {

  TextEditingController row = TextEditingController();
  TextEditingController column = TextEditingController();

  int rowC = 2;
  int colC = 2;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Container(
            height: 500,
            child: GridView.builder(
              itemCount: colC * rowC,
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: rowC,childAspectRatio: colC*rowC/2 ,crossAxisSpacing: 10,mainAxisSpacing: 10),
              shrinkWrap: true,
              itemBuilder: (context, index) => Container(
                color: Colors.greenAccent,
              ),
            ),
          ),
          Text("Row"),
          TextField(
            controller: row,
          ),
          SizedBox(height: 20,),
          Text("Column"),
          TextField(
            controller: column,
          ),
          SizedBox(height: 20,),
          FlatButton(onPressed: (){
            rowC = int.parse(row.text);
            colC = int.parse(column.text);
            setState(() {

            });
          }, child: Container(
            color: Colors.purple,
              padding: EdgeInsets.all(20),
              child: Text("Add")))
        ],
      ),
    );
  }
}