Search code examples
c++imgui

How to create a vertical group of buttons in ImGui?


I have this ImGui menu:

enter image description here

I want to move the "Del" button to the red selected area in the previous image.

This is that part of the menu snippet:

class Waypoint {
public:
    int x, y, z;
    std::string action;
    std::string display;
    Waypoint(std::string action, int x, int y, int z) {
        this->action = action;
        this->x = x;
        this->y = y;
        this->z = z;
        this->display = action + " " + std::to_string(x) + " " + std::to_string(y) + " " + std::to_string(z);
    }
};

static int listbox_item_current = 0;
Waypoint wp1("ROPE", 100, 100, 7);
Waypoint wp2("WALK", 100, 100, 6);
Waypoint wp3("WALK", 110, 131, 6);
std::vector<Waypoint> listbox_items{ wp1, wp2, wp3 };

if (ImGui::CollapsingHeader("Cavebot")) {
    ImGui::ListBox(
    "##listbox::Cavebot",
    &listbox_item_current,
    waypoint_getter,
    listbox_items.data(),
    listbox_items.size()
);

ImGui::SameLine();

if (ImGui::Button("Clean"))
    listbox_items.clear();

ImGui::SameLine();

if (ImGui::Button("Del"))
    listbox_items.erase(listbox_items.begin() + listbox_item_current);

How can I move the "Del" button to be below the "Clean" button?

EDIT:

Testing removing ImGui::SameLine(); between both buttons:

enter image description here


Solution

  • I normally use ImGui::SetCursorPos() for this, as suggested by @thedemons. But there is also ImGui::BeginGroup();.

    Remove the last ImGui::SameLine(); and wrap the two buttons in Begin/EndGroup. Here's a simplified example:

    ImGui::Begin("Window");
    ImGui::Button("x", ImVec2(200,100));
    ImGui::SameLine();
    ImGui::BeginGroup();
    ImGui::Button("Alpha");
    ImGui::Button("Beta");
    ImGui::EndGroup();
    ImGui::End();
    

    enter image description here