SVG Masks

General JUCE discussion
1

Is there way that juce can render svg’s with masks?

My button should look like:

image

,but instead it looks like:
image

lol :frowning:

2

There is support for a clipping path the Drawable class and this is parsed from a “clipPath” in SVGs. The derived Drawable class needs to call applyDrawableClipPath() during its paint() function. Maybe this call to applyDrawableClipPath() just needs adding to DrawableImage::paint()?

3

Wow, thank you - I will see if this works :wink: I would be overjoyed to discover that it did after spending a little too long on dozens of images (I should have checked if it was working first ofc).

So currently I have a little cache of svgs which I call from inside a class which is derived from the DrawableButton class. The svgs are fetched from the cache inside the buttons setImages method like so

	setImages
	(
		svgCache->GetOrUpdateDrawableFromCache((void*)BinaryData::ButtonNormal_svg, BinaryData::ButtonNormal_svgSize),
		svgCache->GetOrUpdateDrawableFromCache((void*)BinaryData::ButtonOver_svg, BinaryData::ButtonOver_svgSize),
		svgCache->GetOrUpdateDrawableFromCache((void*)BinaryData::ButtonDown_svg, BinaryData::ButtonDown_svgSize),
		nullptr,
		svgCache->GetOrUpdateDrawableFromCache((void*)BinaryData::ButtonOnRed_svg, BinaryData::ButtonOnRed_svgSize),
		svgCache->GetOrUpdateDrawableFromCache((void*)BinaryData::ButtonOnOverRed_svg, BinaryData::ButtonOnOverRed_svgSize),
		svgCache->GetOrUpdateDrawableFromCache((void*)BinaryData::ButtonOnDownRed_svg, BinaryData::ButtonOnDownRed_svgSize)
	);

So the call to the DrawableImage::paint is not made inside my class explicitly. So to try this out would I need to override paint in button class? Or did you mean go into the juce_DrawableImage.cpp and add the applyDrawableClipPath() call there?

4

UPDATE:

I added applyDrawableClipPath(g)inside the DrawableImage::paint call and the result was this:
image . It looks like the outline of the mask is there but has been displaced. I have no idea what this means.