mikke89 / RmlUi

RmlUi - The HTML/CSS User Interface library evolved
https://mikke89.github.io/RmlUiDoc/
MIT License
2.57k stars 295 forks source link

SVG decorators, caching and content cropping #598

Open Illation opened 4 months ago

Illation commented 4 months ago

Hi, so the main change here is that with these changes the SVG plugin also adds SVG decorators, so from rcss we can set a property like so: decorator: svg(my_svg.svg);

This is particularly useful for things such as using svgs to decorate input elements like checkboxes, which would have previously required making custom elements instead, but I'm sure there will be many other possible use cases.

To make this practical, I also added an optimization where the baked SVG textures are cached so that if more than one element or decorator uses the same SVG with the same size, we don't create multiple instances of the same texture. It even caches the geometties by associated image colour.

Finally, a neat little feature that is added by this is the ability to set the SVG renderer to crop an SVGs viewbox to its content (so if an svg images content doesn't fill up the entire viewbox, it is scaled up so that the content reaches each edge of the resulting texture). This can be set on elements by setting attribute crop-to-content="true" or setting the cropping property on the SVG decorator to content (or using content as the second parameter in the svg decorator shorthand)