如何动态添加子项到Scaffold Widget

问题描述 投票:0回答:2

比方说,我有一个看起来像这样的聊天屏幕。

enter image description here

现在,当用户单击“准备好时按下”按钮时,将调用方法fetchNewQuestion()

我的意图是这将发出HTTP请求,并使用显示结果

_buildUsersReply(httpResponse);

但是,问题是这个返回必须在当前脚手架的小部件内作为现有子节点下的子节点进行,因此它构建在底部,而前面的子节点仍在那里。结果将是这样的:

enter image description here

你可以找到我的完整代码here

这可以用语法编写吗?或者我是否必须改变我如何做到这一点的概念?

[更新,我现在明白我上面的方法是错误的,我必须使用listview构建器。下面的CurrentStatus显示了我在实现这一目标方面取得的进展。]


Current status:

我已经构建了一个小部件列表:

List<Widget> chatScreenWidgets = []; 

在setState上,我使用这个更新了一个新的Widget:

setState(() { chatScreenWidgets.add(_buildUsersReply("I think there were 35 humans and one horse.")); }); 

现在,在这一点上,我不知道如何在脚手架内传递小部件。我写了一些不起作用的代码。例如,我试过这个:

enter image description here

下图和gist here中的代码:

enter image description here

flutter flutter-layout
2个回答
0
投票

仅供将来参考,以下是我真正需要做的事情:

1.创建小部件列表

List<Widget> chatScreenWidgets = [];

2.在我的方法中,我需要使用setState来向该列表添加元素。我添加到其中的每个小部件都将显示在脚手架上。

`setState(() {
       chatScreenWidgets.add(_buildUsersReply("Some Text"));
    });`

3.然后,在我的脚手架中加载它,我使用了一个itemBuilder,以便将一个小部件列表返回给我的ListView。我已经有了ListView(我手动添加子项)。现在,这只是通过我的业务逻辑方法(在本例中为fetchNewQuestion())中的setState方法返回它们。

body: Stack(
    children: <Widget>[
      Padding(
        padding: EdgeInsets.only(bottom: 0),
        child: new ListView.builder(
          physics: BouncingScrollPhysics(),
          padding: EdgeInsets.symmetric(horizontal: 25),
          itemCount: chatScreenWidgets.length,
            itemBuilder: (BuildContext context, int itemCount) {
              return chatScreenWidgets[itemCount];
            }
        ),
      ),
          ],
        ),
      );`

我希望这有助于未来的工程师!


0
投票

忘记脚手架的想法是关于你真正想要改变什么,让我们说它是一个列表,如果你更新数组你从数组中获取数据,然后列表将更新,如果它是另一种类型的小部件,那么你可以以不同的方式处理它我将编辑这个答案,如果你澄清每个部分在你的小部件中做什么,因为我无法阅读你的完整代码。


  1. 首先,您必须创建一个具有两个属性的对象,一个是行的类型(如果是用户重放或其他消息),第二个属性是字符串或文本。
  2. 现在从上面的对象创建listview类中的全局列表,这样您就可以从用户那里获取数据,甚至可以作为新闻,并从上面的类中创建一个新对象,并将数据添加到列表中并将其添加到列表中。
  3. item构建器返回一个小部件,因此根据您返回的小部件将设置行,因此根据对象中的数据调用一个返回视图的函数,如_buildUsersReply(字符串文本)。

如果你有任何其他问题,你可以问:)如果这是你需要的,请标记为答案。

© www.soinside.com 2019 - 2024. All rights reserved.