Issues with clip and transform properties when used together.

[GiacomoGarbin]

Hi.

Issues with clip and transform properties have already been raised (e.g. https://github.com/mikke89/RmlUi/issues/253) and they should be fixed in the next release (https://github.com/mikke89/RmlUi/pull/594), but I wanted to check that the following case is a real problem or could be a problem with my render interface implementation.

The manual says:

When both a transform and scissor region is active, the scissor region must also have the transform matrix applied for correct results. One solution to this is to draw a rectangle with the position and dimensions of the scissor region into a stencil buffer with the transform applied.

I implemented the suggested solution using the Vulkan backend as an example.

The issue I want to raise is that the transform applied to the scissor region is the transform of the clipped element rather than the transform of the element that generates the clipping area.

Here is an example (clipping_issue.rml.txt):

In the example there is a 2-level hierarchy. The parent element (red) defines a clipping area with the clip: always property. The child element (orange) is rotated with the transform: rotateZ(30deg) property. The expected result would be to see the child element clipped, but when the scissor region is applied, it is also rotated along the child element, causing the incorrect clipping.

It seems like the solution would be to apply the right transform (if any) to the scissor region, but this requires passing this transform to the render interface backend along the scissor region.

I currently have a workaround in my render interface implementation where I store the last rendered geometry (along with its translation and transform) and use it as scissor region, or better scissor geometry. With this workaround I am also able to solve the problem with the border-radius property mentioned at the beginning. But of course this approach generally breaks with an n-level hierarchy where n is greater than 2 or when the parent element defining the clipping area has more than one child (i.e. the child element has siblings), in this case the expected clipping will generally be applied only to the first child that is rendered after the parent.

Thanks.