flutter - Flutter:如何仅使用其中一个子项覆盖整个专栏

Question

我有一列有多个子项，这些子项是具有不同Flexible值的flex小部件。 (对于嵌套行/列，我的实际实现更为复杂，但是找到这种简单情况的解决方案将有所帮助)

当我以编程方式更改Flex值时， children 可以使用开箱即用的漂亮动画很好地适应其 parent 。我可以轻松地使它们更高/更短。

但是，当我希望其中一个 child 独自覆盖所有Column并为其他 child 设置flex=0时，它不起作用。在文档中，它说将flex设置为0或null意味着Flexible小部件不再“灵活”

我将如何处理？任何想法都欢迎。



从图像中可以看到:我想将绿色区域的flex值从3设置为0，并且只能看到覆盖整个屏幕的蓝色区域。

Answer 1

屏幕截图:



但是，您可以为第二个 child 使用Flexible而不是Expanded，这也将起作用。

代码:

@override
Widget build(BuildContext context) {
  int flex1 = 1, flex2 = 0;

  return Scaffold(
    appBar: AppBar(),
    body: Column(
      children: <Widget>[
        Expanded(
          flex: flex1,
          child: Container(
            color: Colors.blue,
            height: 100,
            alignment: Alignment.center,
            child: Text("Flex: $flex1", style: TextStyle(fontSize: 32, fontWeight: FontWeight.bold)),
          ),
        ),
        Expanded( // you can use Flexible also 
          flex: flex2,
          child: flex2 == 0 ? SizedBox() : Container(
            color: Colors.green,
            alignment: Alignment.center,
            child: Text("Flex: $flex2", style: TextStyle(fontSize: 32, fontWeight: FontWeight.bold)),
          ),
        ),
      ],
    ),
  );
}