Skip to content

Clipper & Vertical scrolling. Unsure how to scroll to active item when it's no longer visible? #3578

@vexe

Description

@vexe

Version/Branch of Dear ImGui

Version: 1.79 WIP (17803)
Branch: docking

Back-end/Renderer/Compiler/OS

Back-ends: imgui_impl_win32.cpp + imgui_impl_dx11.cpp
Compiler: MSVC
Operating System: Win7 64-bit & Win10 64-bit

My Issue/Question:

Context:
I basically have file fuzzy finder/searcher/browser thing going on in my text editor, the purpose is to navigate to the selected file upon enter or double click. I give it a list of files from the current directory, I apply a filter to that list using an input text, then I draw the results as a Selectable. The drawing is wrapped around ImGuiListClipper.Begin/End.

The text input should always be the item that has focus/navigation, I type in part of a file name I want, I get filtered results populated, I hit UP or DOWN arrow to move the 'Active Index' up or down. The 'Active Index' is in filtered space. (i.e. ActiveIndex of 0 refers to the first in the FILTERED list)

Problem:
When I move down past the last visible item in the clipper, the window does not automatically scroll. I'm not sure what's the best way to do it.

I tried something like this at the end of the clipper loop:

if (Clipper.StepNo==3 &&
   State->ActiveIndex >= Clipper.DisplayEnd)
{
    ImGui::SetScrollHere();
}

And this at the beginning of it:

if (Clipper.StepNo==3 &&
    State->ActiveIndex <= Clipper.DisplayStart)
    {
         ImGui::SetScrollHere();
    }

It kinda works, but it's pretty ugly, uses internal state and it messes up with mouse wheel scrolling, as I scroll the mouse the "Active Index" becomes out of range, and it keeps trying to SetScrollHere...

Note that previously I didn't use a clipper and the problem was much easier to solve, just "if (ItemIndex==ActiveIndex && !ImGui::IsItemVisible()) ImGui::SetScrollHere();" obviously this doesn't work with the clipper.

Here's a video demonstrating the issue: https://youtu.be/ZNooiltKJIc

And here's my code: https://pastebin.com/yxXYLzjv (wanted you to see full code and not snippets but also bring down the noise in here, but if you prefer to have the code pasted here just let me know!)

I'm pretty sure there's an easier way to do this that I'm missing.
Any help is appreciated, thanks!

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions