I have a grayscale image asset with a transparent background that I would like to overlay with different colors based on the theme color, but none of the BlendModes are providing what I want to do exactly. Here's what the two closest BlendModes look like:
The first one is BlendMode.modulate, and the second one is BlendMode.overlay. Modulate basically darkens the image with the given color, but doesn't touch the transparent parts. Overlay does exactly what I want on the image, but also covers the background, which looks horrible. What I want to do is overlay WITHOUT covering the transparent parts. I tried all the BlendModes but none work. BlendMode.srcATop fills the image with the solid color instead of overlaying it. Adding transparency to the color without using a colorBlendMode just works similar to modulate. What can I do?
SizedBox(
height: constraints.maxHeight * 0.4,
child: Image.asset(
'assets/images/empty-list.png',
colorBlendMode: BlendMode.srcATop,
color: Theme.of(context).primaryColor,
fit: BoxFit.cover,
),
),

