ocornut / imgui

Dear ImGui: Bloat-free Graphical User interface for C++ with minimal dependencies
MIT License
57.74k stars 9.9k forks source link

ClipRect not honored / Overlapping text over docked window borders #7742

Open hsm4 opened 1 week ago

hsm4 commented 1 week ago

Version/Branch of Dear ImGui:

Version 1.90.8, Branch: docking

Back-ends:

imgui_impl_opengl3.cpp

Compiler, OS:

clang, MacOS

Full config/build information:

Dear ImGui 1.90.8 (19080)
--------------------------------
sizeof(size_t): 8, sizeof(ImDrawIdx): 2, sizeof(ImDrawVert): 20
define: __cplusplus=201703
define: __APPLE__
define: __GNUC__=4
define: __clang_version__=15.0.0 (clang-1500.3.9.4)
define: IMGUI_HAS_VIEWPORT
define: IMGUI_HAS_DOCK
--------------------------------
io.BackendPlatformName: imgui_impl_glfw
io.BackendRendererName: imgui_impl_opengl3
io.ConfigFlags: 0x00000443
 NavEnableKeyboard
 NavEnableGamepad
 DockingEnable
 ViewportsEnable
io.ConfigViewportsNoDecoration
io.ConfigMacOSXBehaviors
io.ConfigInputTextCursorBlink
io.ConfigWindowsResizeFromEdges
io.ConfigMemoryCompactTimer = 60.0
io.BackendFlags: 0x00001C0E
 HasMouseCursors
 HasSetMousePos
 PlatformHasViewports
 HasMouseHoveredViewport
 RendererHasVtxOffset
 RendererHasViewports
--------------------------------
io.Fonts: 1 fonts, Flags: 0x00000000, TexSize: 512,64
io.DisplaySize: 1280.00,720.00
io.DisplayFramebufferScale: 1.00,1.00
--------------------------------
style.WindowPadding: 8.00,8.00
style.WindowBorderSize: 1.00
style.FramePadding: 4.00,3.00
style.FrameRounding: 0.00
style.FrameBorderSize: 0.00
style.ItemSpacing: 8.00,4.00
style.ItemInnerSpacing: 4.00,4.00

Details:

In docked windows, I'm getting overlapping text into other windows in the same dock. See the red rectangles in the image as soon as getting scrollbars on the right side when the content no longer fits the window height. You can see the font settings on the right side of the screenshot. They are not influencing the problem. The overlap happens anyway. I searched everywhere with the text "ImGui: Overlapping text over docked windows borders".

Screenshots/Video:

image

Minimal, Complete and Verifiable Example code:

No response

GamingMinds-DanielC commented 1 week ago

Looks like a problem with scissor rects not being set up correctly. Have you modified the render backend in any way or do you use an outdated one by accident? Do you use draw list callbacks that could mess up the render state?

ocornut commented 1 week ago

There's a possibility this is affected by the different resolution between render target and window size on a Mac with Retina display, but since the provided screenshot appears to be near the top-left of window it may not be this. See if things look different on all 4 corners of the window.

We do this in ImGui_ImplOpenGL3_RenderDrawData():

    // Will project scissor/clipping rectangles into framebuffer space
    ImVec2 clip_off = draw_data->DisplayPos;         // (0,0) unless using multi-viewports
    ImVec2 clip_scale = draw_data->FramebufferScale; // (1,1) unless using retina display which are often (2,2)
                // Project scissor/clipping rectangles into framebuffer space
                ImVec2 clip_min((pcmd->ClipRect.x - clip_off.x) * clip_scale.x, (pcmd->ClipRect.y - clip_off.y) * clip_scale.y);
                ImVec2 clip_max((pcmd->ClipRect.z - clip_off.x) * clip_scale.x, (pcmd->ClipRect.w - clip_off.y) * clip_scale.y);
                if (clip_max.x <= clip_min.x || clip_max.y <= clip_min.y)
                    continue;

                // Apply scissor/clipping rectangle (Y is inverted in OpenGL)
                GL_CALL(glScissor((int)clip_min.x, (int)((float)fb_height - clip_max.y), (int)(clip_max.x - clip_min.x), (int)(clip_max.y - clip_min.y)));

Can you verify the value of draw_data->FramebufferScale ? Normally ImGui_ImplGlfw_NewFrame() does:

// Setup display size (every frame to accommodate for window resizing)
int w, h;
int display_w, display_h;
glfwGetWindowSize(bd->Window, &w, &h);
glfwGetFramebufferSize(bd->Window, &display_w, &display_h);
io.DisplaySize = ImVec2((float)w, (float)h);
if (w > 0 && h > 0)
    io.DisplayFramebufferScale = ImVec2((float)display_w / (float)w, (float)display_h / (float)h);

And on a Mac this should set io.DisplayFramebufferScale to (2,2) or (3,3). Try to adjust that value and see if it makes a difference too.

ocornut commented 1 week ago

It may be also good to clarify if this ONLY happens on docked window border as you stated (vs also happening e.g. on any window will scrollable contents). If it does ONLY happens on docked windows as you stated, it may be another cause.

Please also open Tools->Metrics/Debugger->Viewports->Monitors and report the contents displayed there.

hsm4 commented 6 days ago

Thanks a lot for the quick answers. I forgot to mention that you can try it out in the browser in our WebAssembly-Emscripten-GLFW-WebGL version on: https://pallas.ti.bfh.ch/slproject/ Just choose the menu Infos > Statistics > Stats on ImGui and then unfold the Tools group: Overlap-Problem It has nothing to do with docking. I will investigate further on glfwGetWindowSize(bd->Window, &w, &h); glfwGetFramebufferSize(bd->Window, &display_w, &display_h); and also check our non-GLFW builds on Android and iOS.

By the way, Thanks a lot for ImGui and your amazing work! Marcus

hsm4 commented 6 days ago

I guess I'm using an outdated OpenGL3 ImGui rendering. I have everywhere a io.DisplayFramebufferScale of [1,1]. On MacOS I'm requesting the OpenGL context with glfwWindowHint(GLFW_COCOA_RETINA_FRAMEBUFFER, GL_FALSE);