More on uniquely shaped buttons

Hello-- I’ve read the earlier form entries on this topic but am hoping the latest version of Hype offers us non-coders an easier solution. Is it possible to create a shaped graphic and have it work as a button within the shape, not within the background rectangle? I’ve tried both drawing an irregular shape and importing an irregularly shaped SVG graphic, but the button actions are triggered by the shape and its background rectangle.

So I was going to say simply use a vector shape.
These should map to clicks within its shape.

All the on click stuff works.

I was also going to say if you want to have the Bo=utton controls, normal,hover, pressed
The just select the vector shape and use the Edit-> Show Button Controls Menu.

But oddly it is greyed out.? @jonathan.

But what does work is if you add a element like a rect.
Use the Edit-> Show Button Controls Menu on it, then convert it to a vector shape.
The Button Controls will then persist.

Thanks! It works! Just change a circle or rectangle to a vector shape and button actions apply only to the shape, not the background square.

1 Like

Hmm… it is intentional this is disabled but I can’t think of the particular reason off the top of my head. Perhaps it was done for future compatibility where vector shapes might not be able to work correctly as buttons, at least with the current implementation. The workaround you found is an interesting one, but I’d probably consider it a bug as it stands right now.

@graphicsgeezer it sounds like you just need something that only has specific click regions and doesn’t need the button states, correct?

Yup-- very irregular shapes but don’t need button states. I want to make different blocks of text visible for each shape. Currently this works by making the timeline move to a specific time for each shape, but it’s a bit laborious.

Glad you have it working.

I’d probably have to see the document itself and your current approach to see if there was an easier way. The only thing I can think of given current details would be a coding approach, as the hypeDocument.setElementProperty() API allows setting a final location, but you can also add in a duration/timing function to transition the element to it.

The funny think is, straight after id worked the work around out this came up…

So if the workaround is a bug should they not use it…