Move, Drag and Interact with elements e.g. Pacman game

Is it possible to move an object, such as Pacman's circle, with the arrow keys?
Thank you very much.

every key has got an keyCode onkeydown. you can check for it ...

const PACMAN = hypeDocument.getElementById('pacMan');

const MOVEBY = 50;

const DIRECTIONS = {
"37" : ["left", -1],
"38"	: ["top", -1],
"39" : ["left", 1],
"40" :  ["top", 1]	
}


let currentDirection = DIRECTIONS[event.keyCode];	

let newPosition = hypeDocument.getElementProperty(PACMAN, currentDirection[0]) + (MOVEBY * currentDirection[1]);

hypeDocument.setElementProperty(PACMAN, currentDirection[0], newPosition)
1 Like

Thank you very much, I will try it right now. Thanks for the prompt help.

movePacManByArrowKeyCode.hype.zip (11.8 KB)

3 Likes

What a beauty teacher, thank you very much, it is a beauty !!!!!
Abusing you, is there any way that by touching the ghost so to speak, you can do an action? how to disappear it? Sorry the can, but it is for an App for children with disabilities. We are a non-profit Civil Association for children with disabilities in Mexico.
Sorry for so much trouble.

you may open new threads for new requests. starting audio and animate opacity are standardbehehaviors of Hype ... so the documentation can be a good starting point.

I split this into a new topic :wink:

@RUBENOCAMPO May I suggest looking at the documentation as a starting point as Hans has said.

Then perhaps start to build what it is you need and then if you have a problem, you can share the hype document here and people, when they have time, may be able to jump in and help.

Perfect! thank you, teacher

I have already seen it, but my limitations in JavaScript and programming have me in slow learning, but very happy, because I am doing an aApp for children with disabilities. I have a motor disability, I am in a wheelchair.

ok Great! As I said, if you need help don't hesitate to post here. There are more than 1 or 2 people that can help but quite often it's easier to have a document that they can see so that any confusion can be limited. There is normally more that 1 way to achieve the same thing, sometimes an easier or more simple way. :wink:

1 Like