Flutter中如何基于Stack内的最大子容器而非Stack的父容器为Widget设置定位？

你现在遇到的核心问题是：绿色Container作为Stack的直接子组件，它的定位是相对于整个Stack（也就是灰色父容器）的，而不是红色Container。要让它锚定在红色Container的右下角，这里有两个实用的方案：

方案1：将绿色Container嵌套为红色Container的子组件（推荐） #

这种方法最灵活，不管红色Container的位置或尺寸怎么变化，绿色容器都会自动跟着它的右下角走，完全基于红色容器自身的坐标系。

修改后的代码：

return Scaffold(
  body: Center(
    child: Container(
      height: 500,
      width: 350,
      color: Colors.grey,
      child: Stack(
        alignment: Alignment.topRight,
        children: [
          Container(
            height: 300,
            width: 300,
            color: Colors.red,
            // 通过alignment让子组件对齐到自身右下角
            alignment: Alignment.bottomRight,
            child: Container(
              height: 100,
              width: 100,
              color: Colors.green,
            ),
          ),
        ],
      ),
    ),
  ),
);

你只需要给红色Container添加alignment: Alignment.bottomRight，然后把绿色容器放进去作为子元素，就能直接实现需求，不需要手动计算任何位置参数。

方案2：使用Positioned组件手动计算位置 #

如果你的场景需要更精细的控制（比如绿色容器需要脱离红色容器的布局流），可以用Positioned组件，基于红色容器在Stack中的位置来计算定位值：

修改后的代码：

return Scaffold(
  body: Center(
    child: Container(
      height: 500,
      width: 350,
      color: Colors.grey,
      child: Stack(
        alignment: Alignment.topRight,
        children: [
          Container(
            height: 300,
            width: 300,
            color: Colors.red,
          ),
          Positioned(
            // 红色容器在Stack右上角，所以right设为0
            right: 0,
            // Stack高度500，红色容器高度300，所以bottom = 500 - 300 = 200
            bottom: 200,
            child: Container(
              height: 100,
              width: 100,
              color: Colors.green,
            ),
          ),
        ],
      ),
    ),
  ),
);

注意：这个方法的缺点是，如果红色容器的高度、或者Stack的高度发生变化，你需要手动更新bottom的值，灵活性不如第一种方案。

内容的提问来源于stack exchange，提问作者Irfan Ganatra