是否可以使用for循环在build方法内创建小部件?

时间:2020-02-25 18:55:38

标签: flutter

我想制作一个不可滚动的网格,将其整体扩展到其父级。我正在尝试在build方法中运行for循环来创建行和列。但是我遇到了以下错误

The element type 'Set<Row>' can't be assigned to the list type 'Widget'.

The element type 'Set<Text>' can't be assigned to the list type 'Widget'.
在for循环中

。为什么是这样?我该如何解决?

import 'package:flutter/material.dart';

class ExpandingGridArguments{
  List<Widget> tiles;
  int columns;
  int rows;
  ExpandingGridArguments(List<Widget> tiles, int columns)
  {
    this.tiles = tiles;
    this.columns = columns;
    this.rows = (tiles.length / columns).ceil();
  }
}

class StaticGrid extends StatelessWidget {

  @override
  Widget build(BuildContext context) {

    final ExpandingGridArguments arguments = ModalRoute.of(context).settings.arguments;

    return Column(
      children: 
      [
        for(int c = 0; c < arguments.rows; c++ )
        {
          Row
          (
            children : 
            [
              for(int r = 0; r < arguments.columns; r++)
              {
                Text('A row'),
              }
            ]
          ),
        }
      ]
    );
  }
}

2 个答案:

答案 0 :(得分:1)

列表中for的语法与您的语法稍有不同。

代替:

[
  for (var i = 0; i < 42; i++) {
    Text('$i')
  }
]

它不带{}使用:

[
  for (var i = 0; i < 42; i++)
    Text('$i')
]

之所以这样,是因为{}也被用来创建Set / Map

Set<int> hashSet = {};

因此,不支持在列表内使用{}来提高可读性,因为Dart会将“块”与创建Set混淆

答案 1 :(得分:0)

您可以在build方法之外创建一个函数以执行for循环并返回小部件

import 'package:flutter/material.dart';

class ExpandingGridArguments{
  List<Widget> tiles;
  int columns;
  int rows;
  ExpandingGridArguments(List<Widget> tiles, int columns)
  {
    this.tiles = tiles;
    this.columns = columns;
    this.rows = (tiles.length / columns).ceil();
  }
}

class StaticGrid extends StatelessWidget {

  buildRows(ExpandingGridArguments arguments) {
     List<Widget> row = new List();
     for(int c = 0; c < arguments.rows; c++ )
        {
          row.add(
            Row
            (
              children : 
              [
                for(int r = 0; r < arguments.columns; r++)
                {
                  Text('A row'),
                }
              ]
            )
          )
       }
    return row;
  }

  @override
  Widget build(BuildContext context) {

    final ExpandingGridArguments arguments = ModalRoute.of(context).settings.arguments;

    return Column(
      children: buildRows(arguments)
    );
  }
}

我个人认为它更干净。

发生错误的原因是因为for循环在build方法内部执行的方式有所不同。您正在做的是创建一个Set