【Flutter 问题系列第 53 篇】关于 Overflow is deprecated and shouldn‘t be used. Use clipBehavior instead 的解决方案

这是【Flutter 问题系列第 53 篇】，如果觉得有用的话，欢迎关注专栏。

博主目前使用的 Flutter 版本：2.2.3，Dart 版本：2.13.4，Android Studio 版本：Arctic Fox 2020.3.1 Pathc 3

文章目录

- - 一：问题描述
  - 二：解决方案

一：问题描述

把一张图片显示到指定区域内，如下代码所示

return Container(
  color: Colors.red,
  width: 300,
  height: 200,
  child: Stack(
    children: [
      Positioned(
        top: 100,
        child: Image.asset("assets/images/lufei.jpeg"),
      ),
    ],
  ),
);

效果图如下

可以看到超出该区域后的图片不再显示。

这个问题好解决，只需要设置 Stack 组件的属性 overflow 为 Overflow.visible 即可，如下图所示
在这里插入图片描述
设置后图片超出区域也能显示了，但此时会提示

Overflow is deprecated and shouldn't be used. Use clipBehavior instead 的警告信息，就是告诉我们 overflow 属性已经被弃用了，用 clipBehavior 属性代替。

二：解决方案

如果想让在 Stack 组件中的子组件超出区域后也能显示，设置 Stack 组件的 clipBehavior 属性为 Clip.none 即可。

如下图所示
在这里插入图片描述
效果图如下

建议

查看 Stack 组件的源码可知，overflow 属性在 Flutter 1.22 版本后已经被弃用了，既然是已经弃用的，随着 Flutter 版本的更新迭代，早晚会把这个属性去掉。

为了不影响项目代码，项目中还是少用或者不用已经被弃用的组件或者属性。

你的问题得到解决了吗？欢迎在评论区留言。

赠人玫瑰，手有余香，如果觉得文章不错，希望可以给个一键三连，感谢。

结束语
Google 的 Flutter 越来越火，截止 2022年1月6日 GitHub 标星已达 134K，Flutter 毅然是一种趋势，所以作为前端开发者，没有理由不趁早去学习。

无论你是 Flutter 新手还是已经入门了，不妨先点个关注，后续我会将 Flutter 中的常用组件（含有源码分析、组件的用法及注意事项）以及可能遇到的问题写到 CSDN 博客中，希望自己学习的同时，也可以帮助更多的人。