在for循环中使用setState

Question

我想设计一个带有按钮的应用程序。 “奇数”按钮内部将包含一个 for 循环，这样当单击时，屏幕上就会出现奇数。我想对偶数做类似的事情。

> class _MyHomePageState extends State<MyHomePage> {   List<Widget>
> items = [];   @override   Widget build(BuildContext context) {
>     return Scaffold(
>         appBar: AppBar(
>           title: Text("For Loop"),
>         ),
>         body: Column(
>           children: [
>             ElevatedButton(
>               child: Text('All Numbers'),
>               onPressed: () {
>                 for (int i = 0; i < 10; i++) {
>                   items.add(Text("$i"));
>                 }
>                 setState(() {});
>               },
>             ),
>             ElevatedButton(
>               child: Text('Odd Numbers'),
>               onPressed: () {
>                 for (int i = 0; i < 10; i++) {
>                   if(i%2==1){
>                 items.add(Text("$i"));
>                   }
>                 }
>                 setState(() {});
>               },
>             ),
>             ElevatedButton(
>               child: Text('Even numbers'),
>               onPressed: () {
>                 for (int i = 0; i < 10; i++) {
>                  if(i%2==0){
>                 items.add(Text("$i"));
>                   }
>                 }
>                 setState(() {});
>               },
>             ),
>             Expanded(
>                 child: ListView.builder(
>                     itemCount: items.length,
>                     itemBuilder: (context, index) {
>                       return Container(
>                         child: Text(index.toString()),
>                       );
>                     })),
>           ],
>         ));   } }

Answer 1

首先，您需要将列表的类型更改为整数或字符串

List<int> items = [];

之后，您需要记录值（可以是字符串或整数）而不是文本小部件。

所有数字

...
onPressed: () {
 for (int i = 0; i < 10; i++) {
   items.add("$i");
  }
 setState(() {});
},
...

奇数

...
onPressed: () {
 for (int i = 0; i < 10; i++) {
   if (i % 2 == 1) {
     items.add("$i");
   }
  }
 setState(() {});
},
...

偶数

...
onPressed: () {
 for (int i = 0; i < 10; i++) {
   if (i % 2 == 0) {
     items.add("$i");
   }
  }
 setState(() {});
},
...

然后在ListView中显示

Expanded(
 child: ListView.builder(
 itemCount: items.length,
 itemBuilder: (context, index) {
   return Container(
     child: Text(items[index]),
   );
  }
))