如何在 flutter 中动态添加一行？

Question

我的问题是，我有一个 API 提供的图标列表 (CustomWidgets)。我需要将这些图标放在我的应用程序中，但当图标数量达到或超过 7 个时，它看起来像这样：

我想把图标放在不同的行中。我尝试了一种将列表分成 2 部分并动态添加但没有打印任何内容的方法，因为我正在使用 FutureBuilder 打印图标。

代码如下：

FutureBuilder(
            future: investCall, //API CALL
            initialData: [], //NULL SAFE
            builder: (context, snapshot) {
              if (snapshot.hasData){
                return investCodes();
              }else {
                return Divider();
              }
            }, //BARRA DE REDES SOCIALES
          ),

方法投资代码（）；我添加图标的地方

Widget investCodes(){
List<Widget> iconos= []; //EMPTY ICON LIST
for (var object in _investCodes){
  //print('Pintando: '+sn.accesto); DEBUG CONSOLE
  iconos.add(
          Flexible(
          flex: 1,
          child: Container(
            child: GestureDetector(
              onLongPress: (){
                /*...*/
              },
              //JAVA ANDROID ONCLICK LISTENER
              onTap: (){
                _launchURL(object.rfUrl);
              },
              child: Center(
                child: Container(
                  padding: EdgeInsets.only(left: 2.0.h, right: 2.0.h),
                  height: 3.0.h,
                  child: FadeInImage(
                    image: NetworkImage(object.rfIconUrl),
                    placeholder: AssetImage('assets/sn-placeholder.png'),
                  ),
                ),
              ),
            ),
          ),
      )
  );
}


  return Container(
      /*HERE I WANT TO ADD A COLUMN WITH MULTIPLE ROWS*/
      padding: EdgeInsets.all(18.0),
      width: 100.0.w,
      child: Row(
        children: iconos, //LIST OF ICONS
      )
  );
}

Answer 1

我的建议是在你的情况下使用 Wrap 而不是 Row，widget 将放在第二行是不够的 space

有办法做到：

      return Container(
      padding: EdgeInsets.all(16.0),
      width: 100.0.w,
        child: Center(
          child: Wrap(
            spacing: 10.0,
            runSpacing: 10.0,
            direction: Axis.horizontal,
            crossAxisAlignment: WrapCrossAlignment.center,
            children:iconos, //LIST OF ITEMS
          ),
        ),
  );

Final Solution in App

如何在 flutter 中动态添加一行？

How can add a Row dynamically in flutter?

row

flutter

flutter-layout