Tell me please, how I can detect MouseEnter on a custom form image in UMG?

Hello. Tell me please, how I can detect MouseEnter on a custom form image in UMG? (not rectangle, not circle). This image is like a part of some territory, part of a map and I need to highlight it on MouseEnter.

Hi

There’s no magic bullet for this. You just need to write your custom widget so that when it is hovered you translate the mouse position into widget space and use that to lookup into your image. You can choose how to mask it. Let me know if you need more help translating mouse positions.

Chris

I don’t think we have an example. Are you looking to use Blueprint only or C++ too? My approach would probably be to write a new widget (derived from UBorder) in C++ but you might be able to do it in BP by creating a UserWidget that contains a Border plus a bunch of logic. Borders already provide an OnMouseMoveEvent that you can use. The event has a FPointerEvent argument that you should be able to translate into a local position that you can use as a UV to lookup into a mask texture or however you choose to do it. Then you can apply whatever visual effects you want based on the bit of your image you’re hovering. You could tint the whole image, switch the image, etc.

We do currently have a task (UETOOL-55) to implement hit test masks for UMG, but unfortunately I don’t currently have an estimated date for when it would be implemented.

Your best option right now in blueprints would be to what Chris suggested. You can get an “On Mouse Move” event in blueprints which you can use to get the local mouse position.

Unfortunately there isn’t a way to directly access pixel information from an image in blueprints, so you’d have to create either a custom asset type for the mask, or load the mask into a data table which you could check.

Hello Chris.
Can you show me an example how to do it?

Hello Chris.
I would like to use Blueprint only.
Tell me please, do you have plans to implement hit test by mask in UMG in the future releases of UE4?