在以下情况下，堆栈窗口小部件在哪里进入混乱状态

Question

我有两个应该在屏幕上的列中延伸的容器。在这些容器的顶部，我想将卡片放在顶部或另一块材料上。 我的代码看起来像

  Column(
  children: <Widget>[
    Expanded(
      child: new Container(
        color: Colors.red,
      ),
    ),
    Expanded(
      child: new Container(
        color: Colors.green,
      ),
    ),

Answer 1

堆栈小部件应包含列和卡小部件。

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Stack(
      textDirection: TextDirection.ltr,
      children: [
        Column(
          children: <Widget>[
            Expanded(
              child: new Container(
                color: Colors.red,
              ),
            ),
            Expanded(
              child: new Container(
                color: Colors.green,
              ),
            ),
          ],
        ),
        Center(
          child: Container(
            width: 100.0,
            height: 100.0,
            color: Colors.amberAccent,
          ),
        )
      ],
    );
  }
}

屏幕截图：