Flutter中Stack组件内按钮溢出显示问题求助

问题核心是外层的ClipRRect会裁剪所有超出其边界的内容，包括Stack里定位溢出的按钮。只需调整组件嵌套结构，让裁剪仅作用于需要圆角的内部容器，即可解决问题。

修改后的代码 #

class TransactionHistory extends StatelessWidget {
  const TransactionHistory({super.key});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(25.0).copyWith(top: 8, bottom: 15),
      child: Container(
        decoration: const BoxDecoration(color: Colors.transparent),
        child: Stack(
          clipBehavior: Clip.none,
          alignment: Alignment.bottomCenter,
          fit: StackFit.passthrough,
          children: [
            // 仅对需要圆角的容器做裁剪
            ClipRRect(
              borderRadius: BorderRadius.circular(10),
              child: const TransactionTileContainer(),
            ),
            Positioned(bottom: -30, right: 110, child: const SeeAllButton())
          ],
        ),
      ),
    );
  }
}

关键改动说明 #

• 把ClipRRect从包裹整个Container+Stack的外层，移到内部仅包裹TransactionTileContainer，这样只会裁剪该容器的边角，不会影响Stack中溢出的按钮。
• 保留Stack的clipBehavior: Clip.none配置，确保超出Stack边界的按钮不会被自动裁剪。

调整后按钮即可像预期设计那样溢出并完整显示。

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