dart - 如何像在 GridView 中一样缩小 subview

Question

有谁知道如何在 Flutter 中完成 subview 的缩小，如第一张图片所示。我使用了一个 gridView，它做得很好。

在第二张图片上，我使用了一行，我尝试使用 Container 和 Constrains，但效果不是很好。 ;D

 return new GridView.count(
    crossAxisCount: 3,
    padding: const EdgeInsets.all(16.0),
    mainAxisSpacing: 4.0,
    shrinkWrap: true,
    crossAxisSpacing: 4.0,

    children: widget.foodItems.map((FoodViewModel food){
        return new FoodTile(
            name: food.name,
            icon: food.icon
            , onPressed: (bool state) {
              food.isSelected = state;
              widget?.onFoodItemTaped(food, state);
            },
        );
    }).toList(),
);

这里的行代码没有任何约束 返回新的 SingleChildScrollView( child :新容器( 边距:const EdgeInsets.all(16.0),

      child:new Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          new Container(
            padding: const EdgeInsets.all(2.0),
            child: new FoodTile(name: "Tile one", onPressed:(bool state){}),
          ),
          new Container(
            padding: const EdgeInsets.all(2.0),
            child: new FoodTile(name: "Tile two", onPressed:(bool state){}),
          ),
          new Container(
            padding: const EdgeInsets.all(2.0),
            child: new FoodTile(name: "Tile three", onPressed:(bool state){}),
          )

        ],
      )
    ));

Complete source code to the tile

Answer 1

您应该将 FoodTile 的实例包装在 Flexible 或 Expanded 中，以便 Row 应用灵活的布局模型，并均匀分布。