Drag and drop idea

hi everyone,

I’ve got an idea but don’t know where to start to get it to work. So my idea is to have some selectable items on a scene. When the user picks the item they want they drag and drop it into an area on the page.

The difference with what I want to achieve is when the item is selected, the other items disappear and the background of the screen splits into three equal drop areas.

I’ve been using hype for a while now so I have some ideas on how this could work but every solution I’ve tried I’ve come up with so far is a bit clunky and not as smooth as I feel it could be. For example, I’ve created 5 selectable items, when each is press linked to another scene (individual ones created for each) then have the droppable areas on the new scene with the item waiting to be selected again and dropped.

When I’d like is for the user to select the item and in the same move drag into the area.

Anyone got any ideas?

I’ll keep looking into it in the meantime and share any positive results here



I’d probably accomplish this with timelines instead of different scenes. The On Drag action has different phases for the event in the Run JavaScript action; if the event['hypeGesturePhase'] == hypeDocument.kHypeGesturePhaseStart (see this part of the docs) you could run a timeline that fades out other objects and then brings in drop targets. There’s code somewhere on the forums for detecting drops properly; if it is successful you can run whatever actions you need or fade back in the other elements if it is a miss.

1 Like

Thanks for your reply. I’ll have a go at this later and share any results I get on this forum :+1: