Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Right-aligned items are clipped in MenuBar when host window uses horizontal scrolling #6789

Open
DimaKoltun opened this issue Sep 6, 2023 · 7 comments
Labels
bug layout menus menu bars, menu items

Comments

@DimaKoltun
Copy link
Contributor

Version/Branch of Dear ImGui:

Version: 1.88 WIP
Branch: docking

Back-end/Renderer/Compiler/OS

Back-ends: imgui_impl_SDL.cpp + imgui_impl_opengl3.cpp
Compiler: MSVC
Operating System: Windows 10

My Issue/Question:
MenuBar is clipped if it uses a table and window has menu bar and horizontal scrollbar.

Screenshots/Video
https://github.com/ocornut/imgui/assets/83829508/7febecbb-bd3c-461d-ac35-54709f52daea

Standalone, minimal, complete and verifiable example: (see #2261)

        ImGui::Begin("Test", nullptr, ImGuiWindowFlags_MenuBar | ImGuiWindowFlags_HorizontalScrollbar);

        if (ImGui::BeginMenuBar())
        {
            if (ImGui::BeginTable("##layout", 1))
            {
                ImGui::TableNextRow();
                ImGui::TableNextColumn();

                ImGui::Text("Long-long-long-long text");

                ImGui::EndTable();
            }

            ImGui::EndMenuBar();
       }

        if (ImGui::Button("big button", ImVec2(500.f, 500.f)))
        {

        }

        ImGui::End();
@ocornut ocornut added tables/columns menus menu bars, menu items labels Sep 6, 2023
@ocornut
Copy link
Owner

ocornut commented Sep 6, 2023

Err, I have never considered the possibility of using a table inside the menu bar.
What are you trying to achieve with it ?

@DimaKoltun
Copy link
Contributor Author

Err, I have never considered the possibility of using a table inside the menu bar. What are you trying to achieve with it ?

I want to make my own layout, some menus stay on the left of the menu bar, some on the right

@DimaKoltun
Copy link
Contributor Author

DimaKoltun commented Sep 6, 2023

The menu bar used in the viewport and I can fix this bug by using a window that has a menu bar and a child viewport but I don't want to do that because in this case pressing escape will cause the viewport to lose focus.

@ocornut
Copy link
Owner

ocornut commented Sep 6, 2023

It's not a Table specific issue. Using -FLT_MIN or -1.0f to right-align uses the contents region (= rectangle available without scrolling). It's necessary as otherwise they would be a feedback loop.

Consider this:

ImGui::Begin("Test", nullptr, ImGuiWindowFlags_MenuBar | ImGuiWindowFlags_HorizontalScrollbar);
if (ImGui::BeginMenuBar())
{
    ImGui::Button("Test1", ImVec2(-FLT_MIN, 0.0f));
    ImGui::EndMenuBar();
}

ImGui::Button("Test2", ImVec2(-FLT_MIN, 0.0f));
if (ImGui::Button("big button", ImVec2(500.f, 500.f)))
{
}
ImGui::End();

image

Notice it happens even in the Test2 button which is NOT in the menu-bar.

You can visualize this by displaying the value of GetContentRegionAvail().x:

ImGui::Begin("Test", nullptr, ImGuiWindowFlags_MenuBar | ImGuiWindowFlags_HorizontalScrollbar);
if (ImGui::BeginMenuBar())
{
    ImGui::Text("%f", ImGui::GetContentRegionAvail().x);
    ImGui::EndMenuBar();
}
...
ImGui::End();

When you start scrolling the value decrease.

We cannot easy fix this for the main-scrolling layer, but in the case of the menu-bar, since it is in the special "non-scrolling" menu layer, we could argue that we should modify the contents region rectangle and it can be fixed.

@ocornut ocornut changed the title MenuBar is clipped if it uses a table Right-aligned item are clipped in MenuBar when host window uses horizontal scrolling Sep 6, 2023
@ocornut ocornut changed the title Right-aligned item are clipped in MenuBar when host window uses horizontal scrolling Right-aligned items are clipped in MenuBar when host window uses horizontal scrolling Sep 6, 2023
@DimaKoltun
Copy link
Contributor Author

can i fix it somehow, or we should consider good solution?

@ocornut
Copy link
Owner

ocornut commented Sep 6, 2023

I have the correct solution in mind (and have confirmed a few things just now) but it requires work and I can't focus on this right now. In addition even if you manually position items on the right you will currently encounter an issue that emitted item will account in contents size for region. So there's no good solution with horizontal scrollbar until I fix some things.

@ocornut ocornut added the bug label Sep 6, 2023
ocornut added a commit to ocornut/imgui_test_engine that referenced this issue Sep 6, 2023
ocornut added a commit that referenced this issue Sep 6, 2023
… erroneously egister contents size. (#6789)

In dire need of removing BeginGroup()/EndGroup() from menu-bar code, fo r sanity.
@ocornut
Copy link
Owner

ocornut commented Sep 6, 2023

I have pushed a first fix fa2e571
This solve the issue where submitting items inside a menu-bar would impact the contents the main layer when scrolling.

In other words, if you submitted a 500 wide button in menu layer, and scrolled main layer, the 500 px button position in absolute space would extends main scrolling area.

With this fix, if you manually calculate the width of your table inside menu-bar you can submit it and it will work without interfering with scrolling. One way to "cheat" that calculation is to use window->Pos.x + window->Size.x - window->WindowPadding.x or current ClipRect.Max.x and use as your extents to decide on the table width.

e.g.

if (ImGui::BeginMenuBar())
{
    //float avail_width = ImGui::GetContentRegionAvail().x; // this is currently broken
    float avail_width = ImGui::GetCurrentWindow()->ClipRect.Max.x - ImGui::GetCursorScreenPos().x;
    if (ImGui::BeginTable("##layout", 1, ImGuiTableFlags_None, ImVec2(avail_width, 0.0f)))
    {

This will now work. After my second fix you will be able to use GetContentRegionAvail().x which is implicit anyway if you don't a pass a size for the table/item.

I added a test for it:
ocornut/imgui_test_engine@7e472e0
Made the test a little verbose as I will amend it once a second batch of fix is pushed.

(The second part of the fix is the more complicated one, but it's my mind)

ocornut added a commit to ocornut/imgui_test_engine that referenced this issue Sep 6, 2023
ocornut added a commit to ocornut/imgui_test_engine that referenced this issue Sep 6, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug layout menus menu bars, menu items
Projects
None yet
Development

No branches or pull requests

2 participants