Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Help users if they are reusing the same ID (Fix ocornut#7669)
(fix for ocornut#7669) There is a common user issue which is that developers may reuse the same ID, and will not understand why their widget is not responsive. This PR will: * detect when the same ID is used on different widgets (only if the widget is hovered, to avoid a O(n^2) search at each frame) * display a warning tooltip to the user, with hints on how to fix the issue (e.g. use PushID, or add a ## to the label) * allow the user to break in the debugger on any of the widgets that use the same ID * enable to disable the warning when needed (e.g. when reusing the ID is intentional, via PushAllowDuplicateID / PopAllowDuplicateID) * enable to debug all duplicates at once (by defining IMGUI_DEBUG_PARANOID) **View from 10,000 feet** This PR adds a distinction between ```cpp // Same as before ImGuiID GetID(const char* str, const char* str_end = NULL); ``` and ```cpp // returns GetID(), but may display a warning tooltip if the ID is not unique. Should be called only once per frame with a given ID stack. ImGuiID ReserveUniqueID(const char* str_id); ``` This distinction was applied to several widgets inside imgui_widgets.cpp which now call ReserveUniqueID instead of GetID, when their intention is to reserve a unique ID for the widget. See this video for a quick overview of the feature and how it is implemented: https://traineq.org/ImGui/ImGui_PR_Warn_reuse_ID_Explanation.mp4 > _Note: if desired, a compile flag (e.g. IMGUI_NO_WARN_DUPLICATE_ID or its inverse) could be added to disable the warning and make ReserveUniqueID behave like GetID()_ # Summary of changes ## struct ImGuiContext: added fields UidIXXX (UidsThisFrame & co) ```cpp struct ImGuiContext { ... // Declaration ImVector<ImGuiID> UidsThisFrame; // A list of item IDs submitted this frame (used to detect and warn about duplicate ID usage). int UidAllowDuplicatesStack; // Stack depth for allowing duplicate IDs (if > 0, duplicate IDs are allowed). See PushAllowDuplicateID / PopAllowDuplicateID ImGuiID UidHighlightedDuplicate; // Will be set if a duplicated item is hovered (all duplicated items will appear with a red dot in the top left corner on the next frame) int UidHighlightedTimestamp; // Timestamp (FrameCount) of the highlight (which will be shown on the next frame) bool UidWasTipDisplayed; // Will be set to true to avoid displaying multiple times the same tooltip ... // Constructor ImGuiContext(ImFontAtlas* shared_font_atlas) { ... UidsThisFrame.clear(); UidAllowDuplicatesStack = 0; UidHighlightedDuplicate = 0; UidHighlightedTimestamp = 0; UidWasTipDisplayed = false; ... } }; ``` ## struct ImGuiWindow: added ReserveUniqueID(), beside GetID() imgui_internal.h / near GetID() existing methods ```cpp struct ImGuiWindow { ... // ReserveUniqueID: returns GetID(), but may display a warning. Should be called only once per frame with a given ID ImGuiID ReserveUniqueID(const char* str_id); ... }; ``` ## Added PushAllowDuplicateID / PopAllowDuplicateID imgui_internal.h / near related ID functions (SetActiveID, GetIDWithSeed, ...) ```cpp ... IMGUI_API void PushAllowDuplicateID(); // Disables the tooltip warning when duplicate IDs are detected. IMGUI_API void PopAllowDuplicateID(); // Re-enables the tooltip warning when duplicate IDs are detected. ... ``` imgui.cpp:3873 / near ReserveUniqueID() implementation ```cpp IMGUI_API void ImGui::PushAllowDuplicateID() { ImGuiContext& g = *GImGui; g.UidAllowDuplicatesStack++; } IMGUI_API void ImGui::PopAllowDuplicateID() { ImGuiContext& g = *GImGui; IM_ASSERT(g.UidAllowDuplicatesStack > 0 && "Mismatched PopAllowDuplicateID()"); g.UidAllowDuplicatesStack--; } ``` > _Note: doing this via ItemFlags was not feasible as many items (e.g. Button, Checkbox) do not expose flags_ ## Main logic: ImGui::EndFrame(), NewFrame() and ImGuiWindow::ReserveUniqueID() ### ImGui::NewFrame(): ```cpp ... g.UidsThisFrame.resize(0); // Empty the list of items, but keep its allocated data g.UidWasTipDisplayed = false; ``` ### ImGui::EndFrame(): ```cpp IM_ASSERT(g.UidAllowDuplicatesStack == 0 && "Mismatched Push/PopAllowDuplicateID"); if (g.UidHighlightedTimestamp != ImGui::GetFrameCount()) { g.UidHighlightedTimestamp = 0; g.UidHighlightedDuplicate = 0; } ``` ### ImGuiWindow::ReserveUniqueID() in imgui.cpp, at the end of "[SECTION] ID STACK" The pseudocode below summarizes its behavior: ```cpp IMGUI_API ImGuiID ImGuiWindow::ReserveUniqueID(const char* str_id) { ImGuiContext& g = *GImGui; ImGuiID id = GetID(str_id); // If PushAllowDuplicateID was called, do not check for uniqueness if (g.UidAllowDuplicatesStack != 0) return id; // Visual aid: a red circle in the top-left corner of all widgets that use a duplicate of the id if (id == g.UidHighlightedDuplicate) Draw Red dot on top left corner // Only check for uniqueness if hovered (this avoid a O(n^2) search at each frame) if (id == ImGui::GetHoveredID()) { if (g.UidsThisFrame.contains(id) && !g.UidWasTipDisplayed) { // Prepare highlight on the next frame for widgets that use this ID g.UidHighlightedDuplicate = id; g.UidHighlightedTimestamp = ImGui::GetFrameCount(); if (ImGui::BeginTooltip()) { if (! g.DebugItemPickerActive) { // Display tooltip showing the duplicate Id as a string ... // Show hints for correction (PushID, ##) ... ImGui::Text(" Press Ctrl-P to break in any of those items "); if Ctrl-P g.DebugItemPickerActive = true; } else { // Add additional info at the bottom of the ItemPicker tooltip ImGui::Text("Click on one of the widgets which uses a duplicated item"); } ImGui::EndTooltip(); } g.UidWasTipDisplayed = true; } } g.UidsThisFrame.push_back(id); return id; } ``` ## imgui_widgets.cpp **Use ReserveUniqueID, allow duplicates when needed (TempInputText, BeginMenuEx)** I went through all the usages of window->GetID() and changed them to ReserveUniqueID when it was possible / desirable. ### Places with one-line changes In all the places below, the change was extremely simple: I simply replaced `window->GetID` by `window->ReserveUniqueID`. For example, in ImGui::ButtonEx ```cpp bool ImGui::ButtonEx(const char* label, const ImVec2& size_arg, ImGuiButtonFlags flags) ... const ImGuiID id = window->ReserveUniqueID(label); // Instead of window->GetID ``` Below is the list of all function where this simple change was applied: ```cpp InvisibleButton ArrowButtonEx GetWindowScrollbarID ImageButton (both versions) Checkbox RadioButton BeginCombo DragScalar SliderScalar VSliderScalar InputTextEx ColorButton CollapsingHeader Selectable PlotEx BeginTabBar TextLink TreeNode(const char *) TreeNodeEx(const char *) TreeNodeExV(const char *) ``` ### Places where duplicates are needed #### TempInputText TempInputText create text input in place of another active widget (e.g. used when doing a CTRL+Click on drag/slider widgets) It reuses the widget ID, so we allow it temporarily via PushAllowDuplicateID / PopAllowDuplicateID ``` bool ImGui::TempInputText(const ImRect& bb, ImGuiID id, const char* label, char* buf, int buf_size, ImGuiInputTextFlags flags) { ImGui::PushAllowDuplicateID(); ... ImGui::PopAllowDuplicateID(); } ``` #### GetWindowScrollbarID GetWindowScrollbarID had to be split in two: ReserveWindowScrollbarID will perform the ID reservation, while GetWindowScrollbarID is only a query Luckily, this is the only instance where this was required. #### BeginMenuEx In BeginMenuEx, we initially call GetID() instead of ReserveUniqueID() because were are not "consuming" this ID: instead, we are only querying IsPopupOpen(). The ID will be consumed later by calling ImGui::PushID(label) + Selectable("") (which will lead to the same ID) ``` bool ImGui::BeginMenuEx(const char* label, const char* icon, bool enabled) { const ImGuiID id = window->GetID(label); bool menu_is_open = IsPopupOpen(id, ImGuiPopupFlags_None); ... PushID(label); pressed = Selectable("", menu_is_open, selectable_flags, ImVec2(w, label_size.y)); ... } ``` ### Places with no changes, but worth mentioning * TreeNode(const void *): unchanged `TreeNode(const void* ptr_id)` and `TreeNodeExV(const void *)` are the only instances which call `window->GetID(const void *)`. As a consequence, they cannot use the unique id mechanism, but I think their usage is rare enough that is not a big concern. * ImGui::TabBarCalcTabID: unchanged It still uses window->GetID, to avoid issues when merging with the docking branch. * BeginChild, BeginPopup and co are unchanged: since they use ImGui::Begin()/End() internally), I suspect they might be called multiple times with the same string, since it is allowed with ImGui::Begin/End. ## imgui_demo.cpp: some minor changes I went through the full demo Window to look for instances where a duplicate ID might be used, and corrected them. Very few changes were required: * **"Layout/Text Baseline Alignment"**: simple ID fix (Added ##) * **"Widgets/Plotting"**: simple id fix (Added ##) * **"Columns (legacy API)/Borders"**: added ImGui::PushID for each cell * **"Widgets/Drag and Drop/Drag to reorder items (simple)"**: no change, but a transient duplicate ID may appear during reordering (for *one* frame only: see comments in the code) # Demo code in order to test this PR Add and call this function in any imgui example. This code will trigger the warnings for duplicated IDs, and will also enable to make sure that the fixes that had to be done are OK. ```cpp char text1[500] = "Hello,"; char text2[500] = "world!"; char text3[500] = "Hello,"; char text4[500] = "world!"; int value = 0; bool flag1 = false, flag2 = false; float f1 = 0.f, f2 = 0.f, f3 = 0.f, f4 = 0.f; void Gui() { // Some widgets to show the duplicated ID warnings ImGui::SetNextWindowSize(ImVec2(400, 500)); if (ImGui::Begin("Duplicated ID examples", nullptr, ImGuiWindowFlags_MenuBar)) { ImGui::TextWrapped("Example of widgets using duplicated IDs"); ImGui::Separator(); ImGui::TextWrapped("Only the first button is clickable (same ID)"); if (ImGui::Button("button")) printf("Button1 pressed\n"); if (ImGui::Button("button")) printf("Button2 pressed\n"); ImGui::Separator(); ImGui::TextWrapped("Those text inputs will share the same value (editing one will overwrite the other)"); ImGui::InputText("text", text1, IM_ARRAYSIZE(text1)); ImGui::InputText("text", text2, IM_ARRAYSIZE(text2)); ImGui::Separator(); ImGui::TextWrapped("Those radio buttons will share the same value (selecting one will overwrite the other)"); ImGui::RadioButton("radio", &value, 0); ImGui::RadioButton("radio", &value, 1); ImGui::Separator(); ImGui::TextWrapped("The second checkbox cannot be toggled"); ImGui::Checkbox("checkbox", &flag1); ImGui::Checkbox("checkbox", &flag2); ImGui::Separator(); ImGui::TextWrapped("Those two sliders will share the same value (editing one will overwrite the other"); ImGui::SliderFloat("slider", &f1, 0.f, 1.f); ImGui::SliderFloat("slider", &f2, 0.f, 1.f); ImGui::Separator(); } ImGui::End(); // Some widgets to test the fixes that had to be done ImGui::SetNextWindowSize(ImVec2(400, 400)); if (ImGui::Begin("Regression tests", nullptr, ImGuiWindowFlags_MenuBar)) { ImGui::TextWrapped("Small issues had to be fixed inside DragFloat (cf TempInputText), InputTextMultiline and BeginMenuBar.\n" "This window is here to test those fixes."); ImGui::Separator(); if (ImGui::BeginMenuBar()) { if (ImGui::BeginMenu("My Menu")) { ImGui::MenuItem("Item 1"); ImGui::EndMenu(); } ImGui::EndMenuBar(); } ImGui::TextWrapped("DragFloat will reuse the Item ID when double clicking. This is allowed via Push/PopAllowDuplicateID"); ImGui::DragFloat("dragf", &f3); ImGui::Separator(); ImGui::TextWrapped("An issue was fixed with the InputTextMultiline vertical scrollbar, which trigerred a duplicate ID warning, which was fixed"); ImGui::InputTextMultiline("multiline", text1, 500); } ImGui::End(); // A window that is populated in several steps should still detect duplicates { ImGui::SetNextWindowSize(ImVec2(400, 200)); ImGui::Begin("Window populated in several steps"); ImGui::TextWrapped("This window is populated between several ImGui::Begin/ImGui::End calls (with the same window name).\n" "Duplicates should be detected anyhow."); ImGui::Text("A first InputText"); ImGui::InputText("TTT", text3, 500); ImGui::End(); ImGui::Begin("Window populated in several steps"); ImGui::Separator(); ImGui::Text("The second InputText below reuses the same ID, \nin a different ImGui::Begin/ImGui::End context \n(but with the same window name)"); ImGui::InputText("TTT", text4, 500); ImGui::End(); } } ```
- Loading branch information
