Extend button hitbox

[DynamicalCreator]

Version/Branch of Dear ImGui:

Version 1.90.6, Branch: master

Back-ends:

imgui_impl_dx9.cpp + imgui_impl_win32.cpp

Compiler, OS:

Windows 10, Visual Studio 2019

Full config/build information:

No response

Details:

My Issue/Question:

I am trying to create a button with an extended hitbox. The visible button position should stay the same as with a normal button. The difference is that the extended hitbox button has a bigger hitbox around it. When the mouse is hovered over the extended part of the hitbox, the button should change color to ImGuiCol_ButtonHovered, and same with when active.

I need this to make the button easier to press quickly. I'm making a screenshot tool and the buttons are used for resizing the capture rectangle.

I tried to create ImGui::InvisibleButton(), call SetItemAllowOverlap() and then render a normal button inside the invisible button, but the issue was that when the InvisibleButton is hovered or activated, the visible button isn't. The visible button also doesn't even change color. When I call ImGui::IsItemHovered(), it only returns the state for the visible button because it was created last. I need to bundle the two buttons into one, but I'm not sure how. Thanks for helping me.

Screenshots/Video:

No response

Minimal, Complete and Verifiable Example code:

No response

[alien-brother]

In cases like this, I've been drawing manually over the InvisibleButton.

[ocornut]

I am trying to create a button with an extended hitbox. The visible button position should stay the same as with a normal button. The difference is that the extended hitbox button has a bigger hitbox around it. When the mouse is hovered over the extended part of the hitbox, the button should change color to ImGuiCol_ButtonHovered, and same with when active.

This is what style.TouchExtraPadding is for. It defaults to (0,0), you can temporarily increase it when submitting the button.

I tried to create ImGui::InvisibleButton(), call SetItemAllowOverlap()

You would need to call SetINextItemAllowOverlap() before the button, but anyhow only one item is going to be hovered at the same time.

[DynamicalCreator]

@ocornut style.TouchExtraPadding was exactly what I was looking for. Thank you!