Resizeable child?

[nikki93]

Is it possible to make a child area / window that is resizable? I ask because I have a 'long text' view and would like the user to be able to expand the view to see more. The long text is wrapped in a BeginChild()/EndChild() pair. Here's what it looks like:

The vertical bar is moveable / columns are resizable as usual in the horizontal direction, but would like resizing of in the vertical direction to see more of the text.

[ocornut]

Hello @nikki93 ,

It isn't possible at the moment but I would like to support it. I haven't decided how to handle enabling it flags and how precisely to handle the data persistence. Ideally we would make it the default and rely on e.g. ImGuiWindowFlags_NoResize to disable it, but that would unfortunately break quite a lot of old code, and for child window it is probably desirable to be able to control the feature on a per-axis basis.

I will eventually find and implement a solution for this but I don't know when yet.

[nikki93]

@ocornut Wonderful thanks for the heads up! I think after digging around I can do something in userspace over the current ImGui API by having a separator-like button that I watch for drag events on and adjust + persist the sizes of the relevant children accordingly.

[ocornut]

Yes, see #319 for that and in particular my last message. There’s a helper in imgui_internal.h designed for this purpose.

[ocornut]

It is now possible to manually resize child windows by using the ImGuiChildFlags_ResizeX / ImGuiChildFlags_ResizeY flag.

Resizable child window sizes are persistent in .ini file.

Double-click a resizing border makes the window auto-resize on this child (this was also applied to all windows).

There's special handling to switch to a specific relative resize mode only using mouse-delta when a window move within its parent, to avoid feedback loops when e.g. resizing a child window means the parent needs scrolls back up.

Main resizing changes 805cf8d and f1d1a8d, following some earlier related refactors to allow it (e.g. f8dc03d, c95fbb4, e2035a5, bc3c6e7, 4e4042b).

Please note that this come bundled with a slight but actually harmless API-breaking change to BeginChild() api, see 7713c29 and 34a0bc4.

e.g.

BeginChild("Child", ImVec2(0.0f, 400.0f), ImGuiChildFlags_ResizeY);

Resizing may only be done in the layout natural direction aka from the bottom or right border.
(When we add support for e.g. top-to-bottom layout it will become possible to resize from the opposite border)

[ocornut]

Another example showcasing how this could be leverage in places where e.g. splitter patterns (which are not readily usable) would be used;

e.g. "Demo->Examples->Simple Layout" now does:

ImGui::BeginChild("left pane", ImVec2(150, 0), ImGuiChildFlags_Border | ImGuiChildFlags_ResizeX);
for (int i = 0; i < 100; i++)
{
    char label[128];
    sprintf(label, "MyObject %d", i);
    if (ImGui::Selectable(label, selected == i))
        selected = i;
}
ImGui::EndChild();
ImGui::SameLine();
....
ImGui::BeginChild("item view", ....);

Double-clicking fits to required size.

[firesgc]

Hi!

I render my child windows with ImGuiWindowFlags_NoBackground, and for this reason, I don't see the resizing borders.
I have modified the static void ImGui::RenderWindowOuterBorders(ImGuiWindow* window) function like this:

static void ImGui::RenderWindowOuterBorders(ImGuiWindow* window)
{
    ImGuiContext& g = *GImGui;
    float rounding = window->WindowRounding;
    float border_size = window->WindowBorderSize;
    if (border_size > 0.0f && !(window->Flags & ImGuiWindowFlags_NoBackground))
        window->DrawList->AddRect(window->Pos, window->Pos + window->Size, GetColorU32(ImGuiCol_Border), rounding, 0, border_size);

    if (window->ChildFlags & (ImGuiChildFlags_ResizeX | ImGuiChildFlags_ResizeY))
    {
        int resize_border_mask = 0x00;
        if (window->Flags & ImGuiWindowFlags_ChildWindow)
            resize_border_mask |= ((window->ChildFlags & ImGuiChildFlags_ResizeX) ? 0x02 : 0) | ((window->ChildFlags & ImGuiChildFlags_ResizeY) ? 0x08 : 0);
        else
            resize_border_mask = g.IO.ConfigWindowsResizeFromEdges ? 0x0F : 0x00;
        for (int border_n = 0; border_n < 4; border_n++)
        {
            if ((resize_border_mask & (1 << border_n)) == 0)
                continue;

            const ImGuiResizeBorderDef& def = resize_border_def[border_n];
            const ImRect border_r = GetResizeBorderRect(window, border_n, rounding, 0.0f);
            const ImU32 border_col = GetColorU32(ImGuiCol_Separator);
            window->DrawList->PathArcTo(ImLerp(border_r.Min, border_r.Max, def.SegmentN1) + ImVec2(0.5f, 0.5f) + def.InnerDir * rounding, rounding, def.OuterAngle - IM_PI * 0.25f, def.OuterAngle);
            window->DrawList->PathArcTo(ImLerp(border_r.Min, border_r.Max, def.SegmentN2) + ImVec2(0.5f, 0.5f) + def.InnerDir * rounding, rounding, def.OuterAngle, def.OuterAngle + IM_PI * 0.25f);
            window->DrawList->PathStroke(border_col, 0, ImMax(2.0f, border_size)); // Thicker than usual
        }
    }
....

Is there a better solution to fix the issue without modifying ImGui directly? I don't want to "port" my fix with each new release.

Thank you for the awesome library!

[ocornut]

Please open a new issue about this so I can track it. Thank you!
EDIT Opened #7194