gpt4 book ai didi

canvas - 如何将矩阵滤镜应用于 Canvas ?

转载 作者:行者123 更新时间:2023-12-03 03:40:20 32 4
gpt4 key购买 nike

我正在使用Flutter框架和Dart开发图像编辑器,因此无法将矩阵滤镜应用于 Canvas 。

我正在尝试使用“Paint”类和“canvas.drawPaint(paint)”函数将矩阵过滤器应用于 Canvas ,但是我得到了黑色 Canvas 。

Original image

Expected (Variant 2 in code)

I get

class EditorPainter extends CustomPainter {

final ui.Image image;
final double zoom;
final Offset offset;

EditorPainter({
@required this.image,
@required this.zoom,
@required this.offset,
this.elements
});

@override
void paint(Canvas canvas, Size size) {
Size imageSize = Size(image.width.toDouble(), image.height.toDouble());
Size targetSize = imageSize * zoom;

// Variant 1 - not working (draws black canvas)

paintImage(
canvas: canvas,
rect: offset & targetSize,
image: image,
fit: BoxFit.fill
);


// Paint with "sepia" filter
final Paint paint = Paint()
..colorFilter = ColorFilter.matrix([
0.393, 0.768, 0.189, 0.0, 0.0,
0.349, 0.686, 0.168, 0.0, 0.0,
0.272, 0.534, 0.131, 0.0, 0.0,
0.0, 0.0, 0.0, 1.0, 0.0,
]);

canvas.drawPaint(paint);

// Variant 2 - working
// Image with "sepia" filter
paintImage(
canvas: canvas,
rect: offset & targetSize,
image: image,
fit: BoxFit.fill,
colorFilter: ColorFilter.matrix([
0.393, 0.768, 0.189, 0.0, 0.0,
0.349, 0.686, 0.168, 0.0, 0.0,
0.272, 0.534, 0.131, 0.0, 0.0,
0.0, 0.0, 0.0, 1.0, 0.0,
])
);
}
}

我希望得到一个带有过滤图像的 Canvas ,但是我得到一个黑色 Canvas 。
我试图将BlendMode分配给Paint,但没有帮助。

最佳答案

drawPaint用给定的Paint填充 Canvas 。在您的情况下,它会用黑色填充。
您应该修改第一个示例:

final matrix = ColorFilter.matrix([
0.393, 0.768, 0.189, 0.0, 0.0,
0.349, 0.686, 0.168, 0.0, 0.0,
0.272, 0.534, 0.131, 0.0, 0.0,
0.0, 0.0, 0.0, 1.0, 0.0,
]);

context.pushColorFilter(offset,matrix, (context, offset) {
paintImage(
canvas: canvas,
rect: offset & targetSize,
image: image,
fit: BoxFit.fill
);
});
这些将创建一个新层并对其应用滤色器。

关于canvas - 如何将矩阵滤镜应用于 Canvas ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56974363/

32 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com