Flutter - 利用 ClipPath 实现任意形状 Widget

最新推荐文章于 2024-05-25 09:33:34 发布

Flutter 笔记

最新推荐文章于 2024-05-25 09:33:34 发布

阅读量2.6k

点赞数

文章标签： flutter 前端服务器 javascript 运维

本文链接：https://blog.csdn.net/qq_23756803/article/details/106416654

版权

本文介绍了Flutter中使用ClipPath创建自定义形状Widget的方法，通过实现CustomPainter并利用path进行裁剪。文章强调了虽然ClipPath性能开销较大，但能实现复杂形状，如五角星和圆弧。推荐仅在需要时使用，对于简单形状可选择其他性能更好的方法。文章提供了相关资源链接供深入学习。

摘要由CSDN通过智能技术生成

🍭 关于 ClipPath

我们应该都使用过 ClipXXX 相关的组件，来实现一些 圆角矩形/圆形形状十分的方便，那如果想要实现一些奇形怪状的 Widget，例如 五角星/圆弧形之类的，那就只能用 ClipPath了。

想要了解 ClipPath，还是直接去官网撸文档，介绍如下：

A widget that clips its child using a path.

Calls a callback on a delegate whenever the widget is to be painted. The callback returns a path and the widget prevents the child from painting outside the path.

Clipping to a path is expensive.

用 path 来剪切 child 的 widget。

每当要绘制小部件时，都会在委托上调用回调。回调函数返回一个路径，并且该 widget 可防止 child 在 path 外绘制。

裁剪 path 很昂贵。

总的来说，也就是按照路径来剪切子 widget，但是裁剪 path 很昂贵。