Question

我要包装水平listview构建器，我的代码：

return ListView.builder(
            // shrinkWrap: true,
            scrollDirection: Axis.horizontal,
            itemCount: ayahQuran[110]['ayat'].length,
            itemBuilder: (BuildContext context, int index) {
              return Wrap(
                children: <Widget>[
                  Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Text(
                      ayahQuran[110]['ayat'][index]["ayat_ayat"]                 
                    ),
                  ),
                  Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: Text(
                        ayahQuran[110]['ayat'][index]["noayat"].toString()),
                  ),
                ],
              );
            },
          );

my code

我想要这样： want to like this

我为此花了很多时间，任何人都可以帮助我修复它。谢谢

Answer 1

在我的代码列表视图中水平滚动，我想换行。

EDIT：所以要求的是保持元素水平对齐，但具有垂直滚动的能力。

要保持垂直滚动： 您需要将scrollDirection设置为Axis.vertical。但是由于这是默认值，因此您只需从代码scrollDirection: Axis.horizontal,中删除此行即可。

要水平对齐元素：：必须将其放入Row小部件中。

示例：

return ListView.builder(
            // shrinkWrap: true,
            itemCount: ayahQuran[110]['ayat'].length,
            itemBuilder: (BuildContext context, int index) {
              return Wrap(
                children: <Widget>[
                  Row(
                    children: <Widget>[
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Text(
                          ayahQuran[110]['ayat'][index]["ayat_ayat"]                 
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Text(
                        ayahQuran[110]['ayat'][index]["noayat"].toString(),
                         ),
                       ),
                     ],
                   ),
                 ],
               );
             },
           );

如何在Flutter中将小部件包装在ListViewBuilder中

1 个答案: