Is it possible to create non-square buttons?

[crazydef]

Version/Branch of Dear ImGui:

Version 1.89.4

Back-ends:

Custom

Compiler, OS:

Windows 10/11 + Ubuntu 20.04/22.04 + MacOS

Full config/build information:

No response

Details:

Question:

Is it possible to have non-rectangular hit testing for invisible buttons? (I perform all rendering myself.)

I can make rectangular buttons approximate the UI design, but that's not the best user experience, obviously.

Screenshots/Video:

No response

Minimal, Complete and Verifiable Example code:

No response

[ocornut]

ButtonBehavior() doesn't support non-rectangular hit testing yet (see #1512) however you could technically have one invisible button covering your whole menu and then perform the geometrical hit testing yourself. See #434 for a pie menu similar to your example.

[ocornut]

Basically you would submit an InvisibleButton() and perform the hit-testing yourself. Since you are doing all the rendering anyhow it doesn't be difficult.

[crazydef]

Yeah, that's an idea. Not quite as simple as it sounds, as I have a layout engine that controls ImGui, but I can probably figure something out with a custom widget for the window in question.

Cheers.

[GamingMinds-DanielC]

If combining the buttons into one is a problem, you can use multiple buttons as well. You will need to backup a few internals (see ImGui::SetHoveredID() implementation, save everything that is modified in there), then submit an invisible button with the bounding box of your shape and use its hover status as a starting point (filters out foreground windows and other popups), then refine by testing for your custom shape as well. If your hit test passes, you can return the result of the invisible button. If your hit test fails, restore the hover status from before submitting the button. If you wrap this into a helper function (f.e. InvisibleButtonShaped(...)) and use that as a base for individual shaped buttons.

This should already be fine for mouse interaction. If you want advanced functionality for your buttons (like using them as drop targets or having keyboard/gamepad navigation with highlights in the proper shape) it gets more complicated.