Flutter 中的小部件/图像扭曲和扭曲

Wil*_*son 8 rendering dart flutter

像 Transform 小部件这样的小部件可以轻松地在 Flutter 中缩放、平移和倾斜小部件。但没有明显的方法可以直接扭曲或扭曲图像。

以这个扭曲的例子为例:

实施例1

假设此小部件是一个容器,其子部件为装饰图像和文本小部件。在这里,小部件不会被贝塞尔曲线或路径剪切。小部件被“拉伸”或扭曲。使用 Container 小部件可能无法实现这一点,但可以使用 CustomPainter 来完成吗?

另外,看一下这个例子:

实施例2

这里使用波纹效果扭曲图像。是否有可能使用 Flutter 来复制它?

Wil*_*son 4

解决此问题的最佳方法是将小部件转换为图像并通过编辑像素数据或绘制 3D 纹理来对其进行转换。

  1. 使用图像处理的示例
  2. 使用自定义油漆的示例

后者的性能更高,但第一个可以让您更好地控制图像的扭曲方式。

  1. 查看 {1} 的实际应用
  2. 查看{2}的实际应用