Question

我有一段有效的代码！因此，不要寻求调试帮助。

我距离学习日期只有三天的时间，而且大多是积极的，但是有时候很难找到我想要做的事情的有效代码示例。因此，很多试验和错误。我最好的建议是将每个小部件的背景色设置为粗体（黄色，绿色，蓝色），以帮助解决设计/布局问题。

但是，我读了很多关于如何实现这样的东西的信息：从API检索json数据，遍历它以使用Future <>创建小部件的动态列表。我的例子是此时的纯颤动网。

问题是-许多站点建议也使用列表生成器，并且对我而言，我无法使其正常运行。它不断溢出浏览器的底部，我找不到任何扩展它的方法。我使用了“用于列表中的模型”循环，它运行良好。

所以，我的问题是-如果我给您工作代码，您能建议一个更好的方法/实现吗？

 Widget build(BuildContext context) {
    return FutureBuilder<List<Menurender>>(
        future: fetchMenu(),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.none &&
              snapshot.hasData == null) {
            //print('project snapshot data is: ${projectSnap.data}');
            return Container();
          }
          return Container(
            width: MediaQuery.of(context).size.width,
            //color: Colors.yellow,
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Container(
                  width: MediaQuery.of(context).size.width * .80,
                  child: SingleChildScrollView(
                      child: Column(children: [
                    for (Menurender menu in snapshot.data)
                      Column(children: <Widget>[
                        Row(
                          children: <Widget>[
                            //SizedBox(width: 60),
                            Text(
                              '${menu.weekDayFull}',
                              style: TextStyle(
                                  color: Color(0xff444444),
                                  fontSize: 32,
                                  letterSpacing: 2,
                                  fontWeight: FontWeight.w600,
                                  fontFamily: 'Fira Sans'),
                            ),
                          ],
                        ),
                        Row(
                          children: <Widget>[
                            //SizedBox(width: 60),
                            Column(
                              children: <Widget>[
                                Text(
                                  '${menu.dayOfMonth} ${menu.monthFull}',
                                  style: TextStyle(
                                      color: Color(0xff333333),
                                      fontSize: 14,
                                      fontWeight: FontWeight.w400,
                                      fontFamily: 'Fira Sans'),
                                ),
                              ],
                            ),
                            Expanded(
                                child: Column(
                              children: <Widget>[
                                Padding(
                                  padding:
                                      const EdgeInsets.fromLTRB(10.0, 0, 0, 0),
                                  child: Container(
                                    decoration: BoxDecoration(
                                        //color: Colors.red,
                                        border: Border(
                                      bottom: BorderSide(
                                          color: Color(0xff4A4A4A4A)),
                                    )),
                                  ),
                                ),
                              ],
                            ))
                          ],
                        )
                      ])
                  ])),
                ),
              ],
            ),
          );
        });
  }

实际的代码在这里，因此您可以看到我要完成的工作：我的测试正在进行中： https://flavorboxstorage.z23.web.core.windows.net/#/

实际公司wordpress网站： https://www.flavorboxsaigon.com/

Answer 1

在小部件树中编写一个Product Stock Options循环会使Flutter在重建小部件时生活困难，并可能影响性能。您应该能够像这样使用ListView.builder：

Yes

Answer 2

如果您想使用for循环，就可以像这样

ListView(
   children: <Widget>[
     for(var x=0; x<snapshot.data.length;x++)
     Container(
        child: Column(children: <Widget>[
                    Row(
                      children: <Widget>[
                        //SizedBox(width: 60),
                        Text(
                          '${menu.weekDayFull}',
                          style: TextStyle(
                              color: Color(0xff444444),
                              fontSize: 32,
                              letterSpacing: 2,
                              fontWeight: FontWeight.w600,
                              fontFamily: 'Fira Sans'),
                        ),
                      ],
                    ),
                    Row(
                      children: <Widget>[
                        //SizedBox(width: 60),
                        Column(
                          children: <Widget>[
                            Text(
                              '${menu.dayOfMonth} ${menu.monthFull}',
                              style: TextStyle(
                                  color: Color(0xff333333),
                                  fontSize: 14,
                                  fontWeight: FontWeight.w400,
                                  fontFamily: 'Fira Sans'),
                            ),
                          ],
                        ),
                        Expanded(
                            child: Column(
                          children: <Widget>[
                            Padding(
                              padding:
                                  const EdgeInsets.fromLTRB(10.0, 0, 0, 0),
                              child: Container(
                                decoration: BoxDecoration(
                                    //color: Colors.red,
                                    border: Border(
                                  bottom: BorderSide(
                                      color: Color(0xff4A4A4A4A)),
                                )),
                              ),
                            ),
                          ],
                        ))
     )
   ]
)

如果需要ListView.builder

ListView.builder(
   itemCount: snapshot.data.length,
   itemBuilder: (context, index){
       return Container(
        child: Column(children: <Widget>[
                    Row(
                      children: <Widget>[
                        //SizedBox(width: 60),
                        Text(
                          '${menu.weekDayFull}',
                          style: TextStyle(
                              color: Color(0xff444444),
                              fontSize: 32,
                              letterSpacing: 2,
                              fontWeight: FontWeight.w600,
                              fontFamily: 'Fira Sans'),
                        ),
                      ],
                    ),
                    Row(
                      children: <Widget>[
                        //SizedBox(width: 60),
                        Column(
                          children: <Widget>[
                            Text(
                              '${menu.dayOfMonth} ${menu.monthFull}',
                              style: TextStyle(
                                  color: Color(0xff333333),
                                  fontSize: 14,
                                  fontWeight: FontWeight.w400,
                                  fontFamily: 'Fira Sans'),
                            ),
                          ],
                        ),
                        Expanded(
                            child: Column(
                          children: <Widget>[
                            Padding(
                              padding:
                                  const EdgeInsets.fromLTRB(10.0, 0, 0, 0),
                              child: Container(
                                decoration: BoxDecoration(
                                    //color: Colors.red,
                                    border: Border(
                                  bottom: BorderSide(
                                      color: Color(0xff4A4A4A4A)),
                                )),
                              ),
                            ),
                          ],
                        ))
     )
   ]
);
   }
)

但是对我来说，我将map用作Listview的子项

列表生成器与for循环

2 个答案: