Flutter移动端开发：底部紫色Container右侧Padding未生效求助

你给紫色Container设置了width: MediaQuery.of(context).size.width，这个值是屏幕的完整宽度。当外层套了Padding(all:8)后，Container实际占用宽度变成屏幕宽度 + 16px（左右各8px的padding），超出了屏幕范围，导致右侧padding被挤出屏幕，肉眼看不到效果。

有两种简洁的修复方式：

方式1：用Positioned直接控制边距（推荐） #

去掉外层Padding，直接通过Positioned的left、right、bottom属性设置8px边距，同时无需手动指定Container宽度，让它自动填充剩余空间：

Positioned(
  left: 8,
  right: 8,
  bottom: 8,
  child: Container(
    color: Colors.purple[100],
    height: 315,
    child: const Center(child: Text('Text')),
  ),
)

方式2：调整Container宽度 #

如果想保留外层Padding，需要把Container的宽度减去左右padding的总和（8*2=16）：

Positioned(
  left: 0,
  bottom: 0,
  child: Padding(
    padding: const EdgeInsets.all(8.0),
    child: Container(
      color: Colors.purple[100],
      height: 315,
      width: MediaQuery.of(context).size.width - 16,
      child: const Center(child: Text('Text')),
    ),
  ),
)

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