Discuss Scratch

KrunkerDOTio
Scratcher
34 posts

Making a draggable, scrolling menu

In my scratch game I've been planning to make a skill tree that you can drag around with your mouse and scrolls indefinitely. I made a basic script that does exactly this, but I have a problem when trying to make the scrolling. Whenever an object hits the border it should disappear until you drag it back inside. Now imagine you drag an object all the way to the border, you let go of clicking and you then you hold it again. Now when you drag the object back the positioning is off.
I've thought of trying to make the object calculate its x and y when outside of the screen, I have successfully done that in a past attempt but another problem arises with the mouse's x and y variables. They can never go outside of the |240| and |180| limit so when you try to drag the object back inside the position is off once again. I've reverted back the old code and I'm making this forum post so that somebody will hopefully find a more clever solution to this. Thanks in advance!

Game link:
https://scratch.mit.edu/projects/1255667031/
dem_bot
Scratcher
100+ posts

Making a draggable, scrolling menu

What I would do is display the tech tree with my 2D map engine and
when the mouse goes down, store the mouse position and the camera position and move the camera along with the mouse or
just have the camera position be the mouse position * a constant
g6g6g66g6g
Scratcher
51 posts

Making a draggable, scrolling menu

Treat the entire thing like a scrolling level:

  • Use two variables for the xpos and ypos of the whole skill tree (which I'll call cam x and cam y, short for camera)
  • Each clone that is an object in the skill tree should have its own relative xpos and ypos variables to make them off center from the camera so they don't all move to the same place. Their global position is (xpos + cam x), (ypos + cam y)
  • Instead of using the arrow keys to move, use mouse dx and mouse dy (d = delta, the rate of change) to change cam x and cam y. Find them by storing the last mouse coordinates, and seeing the amount the current coordinates have changed.

Using a centralized coordinate system by adding cam x and cam y allows you to move everything around in ways other than dragging. Also, if you pick up an individual sprite it will snap back to its original spot.
Having their coordinates determined only by variables means they can't be affected by the border boundaries.

DEMO

Last edited by g6g6g66g6g (Yesterday 12:38:58)

Powered by DjangoBB