使用颤振中的用户输入行和列创建 Gridview

如何解决使用颤振中的用户输入行和列创建 Gridview

我们如何使用用户输入创建 Gridview？允许用户输入行数和列数。

解决方法

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,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")))
        ],);
  }
}

您可以使用 GridView.builder 来实现您的要求。

GridView.builder(
          shrinkWrap: true,itemCount: (rowCount * ColumnCount),gridDelegate:
              SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: ColumnCount),index) {
            return Container(
              child: Text(index.toString()),);
          },);

您必须刷新小部件的每个用户输入。