Android 添加带有按钮的动态小部件

当我尝试将动态小部件添加到我的应用程序时，我遇到了一个奇怪的错误。当按下“添加”按钮时，屏幕完全变白，我不知道为什么会发生这种情况。 我使用的资源，我在颤振真的是新的，也许我忘记了一些东西添加，但我检查了很多次。 这是我的密码

class DynamicWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: new TextField(
        decoration: new InputDecoration(hintText: 'Press + to Add Field'),
      ),
    );
  }
}

列表的初始化

  List<DynamicWidget> listDynamic = [];

  addDynamic() {
    listDynamic.add(new DynamicWidget());
    print("addDynamic");
    setState(() {});
  }

我不确定，但问题可能在这里

final testText = Visibility(
  child: new Column(
    children: <Widget>[
      new Flexible(
        child: new ListView.builder(
          itemCount: listDynamic.length,
          itemBuilder: (_, index) => listDynamic[index],
        ),
      ),
    ],
  ),
);

final testText=可见性(
子：新列(
儿童：[
新柔性(
子项：新建ListView.builder(
itemCount:listDynamic.length，
itemBuilder:（_，index）=>listDynamic[index]，
),
),
],
),
);

这里我调用我的小部件，我在这里声明它为变量

final body = Container(
      child: SingleChildScrollView(
        child: Column(
          children: <Widget>[
            testText,
            strPhoto
          ],
        ),
      ),
    );

final body=容器(
子：SingleChildScrollView(
子：列(
儿童：[
测试文本，
斯特菲托
],
),
),
);

最后是我的按钮

    return Scaffold(
        appBar: new AppBar(title: new Text(device_type), centerTitle: true),
        drawer: Menu(),
        body: body,
        floatingActionButton: Column(
          crossAxisAlignment: CrossAxisAlignment.end,
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            FloatingActionButton(
              heroTag: null,
              child: Icon(
                Icons.add,
                color: Colors.white,
              ),
              onPressed: () {
                addDynamic();
              },
            ),
          ],
        ));
 

返回脚手架(
appBar:new appBar（标题：新文本（设备类型），中心标题：true），
抽屉：菜单（），
身体:身体,，
floatingActionButton:列(
crossAxisAlignment:crossAxisAlignment.end，
mainAxisAlignment:mainAxisAlignment.end，
儿童：[
浮动操作按钮(
heroTag:null，
子：图标(
Icons.add，
颜色：颜色，白色，
),
已按下：（）{
addDynamic（）；
},
),
],
));

---

感谢您的帮助。

您必须创建变量小部件并添加到Scaffold上的构建上下文中。

在第一步中，我创建了一个名为CustomTextField的小部件

import 'package:flutter/material.dart';

class CustomTextField extends StatelessWidget {
final String hint;
final TextEditingController controllers;

CustomTextField(this.hint, this.controllers);

    @override
    Widget build(BuildContext context) {
    return Padding(
        padding: EdgeInsets.only(top: 2.0, left: 6.0, right: 6.0, bottom: 2.0),
        child: Column(
          children: <Widget>[
            TextField(
                decoration: InputDecoration(hintText: hint),
                controller: controllers),
            SizedBox(height: 4.0),
          ],
        ),
      );
    }
}

导入“包装：颤振/材料.省道”；
类CustomTextField扩展了无状态小部件{
最后的字符串提示；
最终文本编辑控制器；
CustomTextField（this.hint、this.controllers）；
@凌驾
小部件构建（构建上下文）{
返回填充(
填充：仅限边设置（顶部：2.0，左侧：6.0，右侧：6.0，底部：2.0），
子：列(
儿童：[
文本字段(
装饰：输入装饰（hintText:hint），
控制器：控制器），
尺寸箱（高度：4.0），
],
),
);
}
}

这个小部件给我一个文本用于在提示上显示，一个控制器用于控制文本字段

在下一步中，我以这种方式更改homepage类 我有自定义文本字段（我的小部件）的列表，并使用构建方法的映射列表显示在listview上

import 'package:flutter/material.dart';
import 'CustomTextField.dart';

class PageTutorial extends StatefulWidget {
  @override
  _PageTutorialState createState() => _PageTutorialState();
}

class _PageTutorialState extends State<PageTutorial> {
  List<CustomTextField> widgets = [
    CustomTextField("UserName", TextEditingController())
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: widgets.map<Widget>((widget) => widget).toList(),
      ),
      floatingActionButton: FloatingActionButton(
          onPressed: () {
            setState(() {
              widgets.add(CustomTextField("Password", TextEditingController()));
            });
          },
          child: Icon(Icons.add)),
    );
  }
}

导入“包装：颤振/材料.省道”；
导入“CustomTextField.dart”；
类PageTutorial扩展StatefulWidget{
@凌驾
_PageTutorialState createState（）=>\u PageTutorialState（）；
}
类_页面教程状态扩展状态{
列表小部件=[
CustomTextField（“用户名”，TextEditingController（））
];
@凌驾
小部件构建（构建上下文）{
返回脚手架(
正文：ListView(
子项：widgets.map（（widget）=>widget.toList（），
),
浮动操作按钮：浮动操作按钮(
已按下：（）{
设置状态（）{
添加（CustomTextField（“密码”，TextEditingController（））；
});
},
子：图标（Icons.add）），
);
}
}

---

玩得开心

所有这些代码块都在一个文件中吗？如果所有这些都在一个文件中，请更新您的问题，将所有这些代码块转换为一个代码块。因为可能存在函数、testText和其他函数在哪里的问题。我知道哪个代码块在做什么。但我要求在一个代码块中包含所有这些。因为你的代码结构可能有问题。我已经复制了所有这些代码。但是我不能跑。它在

SingleChildScrollView

中显示错误。所以，如果你把所有的代码都放在一个代码块中，这会很有帮助。你能举个例子吗？