Overflow-y:scroll not working as expected #711
Comments
|
Which renderer are you using? Does clipping work at all in other situations? |
|
I am using my own renderer... and I had assumed clipping had been working, but am not so sure now. I believe it was working previously with the older style RML render interface. I only have scissor implemented, and not clip masks. I am assuming this relies on scissors? To clarify how the new render interface works with scissors.... I am assuming the sequence of render calls / events is: EnableScissorRegion(true) Is that about right? |
|
I see. Yeah generally, that should be the order. But please check what you're actually getting through the render interface. If you can test with our built-in backends too (or replicate in our code base), that would be helpful. There are some situations where clip masks are needed. In particular if you are using any transforms, or border radius combined with hidden overflow. Then your assumptions might not be correct. |
|
@mikke89 I am not able to (easily) test with the built-in backends without significant work. My renderer and codebase is C#, and I wrote a proxy to bridge my C# code with the RML code. I did set some breakpoints, and it doesn't look like the scissor methods are being called, so it looks like it's not using a scissor for this. It is breakpointing on the clipmask methods, so it looks like it needs clipmasks to be implemented for this. Is there a way to force or get it to leverage scissors, or what should I change in my RML to use scissors instead of clipmasks? I currently don't have support for clipmasks implemented. |
|
Sounds interesting with the C# bindings, I understand if you can't easily test that. If you do suspect it's a bug on the RmlUi side, then it would be helpful if you could be able to reproduce it in our code base. In terms of the rml and clip masks, the main culprits are those mentioned above, border radius with non-visible overflow, and transforms. |
|
I combed through my RML, and am not seeing use of radius or non-visible overflow anywhere, so can't see why it would attempt to use a clipmask instead of a scissor. I'll do more digging to see if I can figure out what's going on. Worst case is I'll have to implement clipmasks. Thanks. |
|
Just tested with the RML you posted and got these results (with 10 inner elements): So no clip masks here, only a single scissor operation. If you are able to reproduce this in our codebase, I would be able to investigate and be a lot more helpful. |
|
@mikke89 Thanks for digging into this. Can you show the entire RML you used so I can test using the exact same thing? It's possible I have some other RML that's triggering a clip mask instead of scissors. I'll strip it down to the bare minimum to test. |
|
No problem, sounds good. Here is the RML I used: <rml>
<head>
<title>Demo</title>
<link type="text/rcss" href="/assets/rml.rcss" />
<style>
body
{
font-family: LatoLatin;
font-weight: normal;
font-style: normal;
font-size: 15dp;
color: white;
width: 500dp;
height: 525dp;
margin: auto;
}
</style>
</head>
<body>
<div style="height:100dp; width:100%; overflow-y:scroll; background-color: #0000FF;">
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
<div style="font-size:16dp; border: 1px; height:50dp; width:100%;">blah</div>
</div>
</body>
</rml> |
I have a div with overflow-y set to scroll, and within it I am generating a list of divs from an array. The problem is the overflow isn't being hidden as expected.
Here's the corresponding rml:
I am attaching screenshots of the results. Any ideas on why the overflow isn't being contained?
The text was updated successfully, but these errors were encountered: