Z-index rendering order incorrect in OpenGL, GLFW pre-built backends
Closed this issue · 3 comments
Hello, I've recently integrated RmlUI into my OpenGL 4.6, GLFW project. I've gotten things to render using the pre-built backends on GitHub, but I've noticed the z-index seems to be rendering in reverse order; The element with the lower z-index seems to get rendered on top. I've tried to mess around with the code in the RmlUi_Renderer_GL3.cpp file and others, but haven't quite figured out what I need to change to reverse the z-index - is it possible a change is needed in the source instead of the backends? Is it possible I'm not setting up something else correctly?
I will note I have talked to at least one other person who has noted the exact same bug with the glfw opengl backends. We are both using opengl 4.6, in case that would be the core issue here.... I know the renderers were built for opengl 3.
Here are images of the .rml file I'm testing and the result. If I flip the z-index of #blue-box to be less than #red-box only then does the #blue-box correctly render on top. I notice the same issue if I don't use z-index at all and just render one div inside of another, the parent always renders on top of the child.
Thanks for any advice!
Hello! I took a look at this one now. First of all, which version are you using?
I can't replicate your results on my end, this is what I get with your source on GLFW_GL3:
Looking over the CSS tests too, it looks like they're pretty much all in order, here is one example:
While I don't think this matters for the issue here, please be aware that there are no built-in styles in RmlUi, so you will need to style elements like divs yourself. See our rml.rcss style for a good starting point.
I notice the same issue if I don't use z-index at all and just render one div inside of another, the parent always renders on top of the child.
This has me very confused. They should be rendered in order. It should be easy enough to verify that the render interface receives them in the right order. Look at the geometry color and track the geometry to the render call. If they are submitted in the right order by the library, but they still end up reverse, then something is wrong with the renderer's state. One possibility could be the depth buffer, anything like that should be disabled. We do disable that during BeginFrame() though. Maybe you missed the call to that?
By the way, please post source code as source code instead of an image next time? ;) Thanks!
Hi mikke, thanks for the information! After playing around with the GLFW_GL3 backend it looks like you were right - I was not properly calling BeginFrame() and EndFrame(). I think what tripped me up is that some code samples I was looking at didn't directly call either directly, like this one https://mikke89.github.io/RmlUiDoc/pages/cpp_manual/main_loop.html.
Thanks again for taking a look at this even though the fix ended up being so silly and simple! I'll also make sure to actually post the source code directly next time, GitHub didn't let me upload the .rml file directly but I know I can change it to .txt to make it work.
No problem, glad to help out!
And I understand the confusion, so I pushed some changes to the documentation: mikke89/RmlUiDoc@03990c0
Hopefully, that clarifies it a bit.