如何包装小部件列表?

时间:2020-05-13 05:45:18

标签: flutter

i have the problem at the buttom我有这个,但是当我在屏幕上显示时,它以垂直方式不显示任何内容。我需要它像一排一样显示所有内容。我首先创建一个小部件列表,其中包含使用包装小部件呈现信息所需的所有信息,但是我接受了列表,其中显示了所有信息,但没有包装。

Widget _calcularPrecios(int i, double valor) {
      double trimestral = valor *3;
      double semestral = trimestral *2;
      double anual = semestral *2;
      double contado = anual-anual*0.12;
      if(i==1) {
        return Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Container(
              width: 5,
              height: 50,
              color: Color(0xFF1BB394),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Color(0xFFE0F7FA)
              ),
              width: 120,
              height: 50,
              child: Padding(
                padding: const EdgeInsets.only(left: 10.0),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text('Mensual', style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.bold),),
                    Text('\$'+valor.toStringAsFixed(2), style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.w500))
                  ],
                ),
              ),
            )
          ],
        );
      }else if(i==2) {
        return Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Container(
              width: 5,
              height: 50,
              color: Color(0xFF1BB394),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Color(0xFFE0F7FA)
              ),
              width: 120,
              height: 50,
              child: Padding(
                padding: const EdgeInsets.only(left: 10.0),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text('Trimestral', style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.bold),),
                    Text('\$'+trimestral.toStringAsFixed(2), style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.w500))
                  ],
                ),
              ),
            )
          ],
        );
      }else if(i==3) {
        return Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Container(
              width: 5,
              height: 50,
              color: Color(0xFF1BB394),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Color(0xFFE0F7FA)
              ),
              width: 120,
              height: 50,
              child: Padding(
                padding: const EdgeInsets.only(left: 10.0),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text('Semestral', style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.bold),),
                    Text('\$'+semestral.toStringAsFixed(2), style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.w500))
                  ],
                ),
              ),
            )
          ],
        );
      }else if(i==4) {
        return Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Container(
              width: 5,
              height: 50,
              color: Color(0xFF1BB394),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Color(0xFFE0F7FA)
              ),
              width: 120,
              height: 50,
              child: Padding(
                padding: const EdgeInsets.only(left: 10.0),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text('Anual', style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.bold),),
                    Text('\$'+anual.toStringAsFixed(2), style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.w500))
                  ],
                ),
              ),
            )
          ],
        );
      }else if(i==5) {
        return Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Container(
              width: 5,
              height: 50,
              color: Color(0xFF1BB394),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Color(0xFFE0F7FA)
              ),
              width: 120,
              height: 50,
              child: Padding(
                padding: const EdgeInsets.only(left: 10.0),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text('Contado', style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.bold),),
                    Text('\$'+contado.toStringAsFixed(2), style: TextStyle(
                        fontSize: 15, fontWeight: FontWeight.w500))
                  ],
                ),
              ),
            )
          ],
        );
      }
    }



    List <Widget> _calcular(double valor){
      List<Widget> temporal =[];
      for(var i = 1; i<6;i++){
        temporal.add(_calcularPrecios(i,valor));
      }
      return temporal;
    }

(_calcular(valor).isNotEmpty)? Wrap(
                        children: _calcular(valor),
                      ): Center(child: Text('Presione boton calcular')),

1 个答案:

答案 0 :(得分:0)

我解决了问题,列表中的所有小部件都占用了屏幕宽度的大小 因此列表中的所有行都放在了SizedBox中