如何通过代码将小部件添加到列

Question

我正在尝试将小部件动态添加到列。以下方法不起作用，因为单击按钮时不会添加文本小部件。我想了解为什么这不起作用以及我应该怎么做才能使它起作用。提前感谢您的帮助。

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    List<Widget> c = [];

    return MaterialApp(
      title: 'Flutter Demo',
      home: Column(children: [
        Column(children: c),
        ElevatedButton(onPressed: (){
          print("testing");
          c.add(Text("testing"));
        }, child: Text("Add Text"))
      ])
    );
  }
}

编辑：我将代码编辑为有状态小部件，并在将小部件添加到容器的函数周围添加了一个 setState 函数，但它仍然不起作用

import 'package:flutter/material.dart';


class SW extends StatefulWidget {
  const SW({ Key? key }) : super(key: key);

  @override
  _SWState createState() => _SWState();
}
class _SWState extends State<SW> {
  @override
  Widget build(BuildContext context) {
    List<Widget> c = [];

    return MaterialApp(
      title: 'Flutter Demo',
      home: Column(children: [
        Column(children: c),
        ElevatedButton(onPressed: (){
          setState((){
            print("testing");
            c.add(Text("testing"));
          });
        },
        child: Text("Add Text"))
      ])
    );
  }
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SW();
  }
}



void main() {
  runApp(MyApp());
}

Answer 1

    import 'package:flutter/material.dart';

void main() => runApp(MaterialApp(home:MyApp()));

class MyApp extends StatefulWidget {
  @override
  _MyState createState() => _MyState();
}

class _MyState extends State<MyApp> {

  List<Widget> c = [];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body:Column(children: [
        Column(children: c),
        ElevatedButton(onPressed: (){
          setState((){
print("testing");
          c.add(Text("testing"));
});
        }, child: Text("Add Text"))
      ]),
    );
  }
}

将您按下的代码封装在 setstate 中以重建页面。 setState 函数触发屏幕中显示的整个小部件树的重建。否则，文本小部件将仅添加到列表中，但不会显示在屏幕上。