Hi,
I’m trying to make an object move, by [[Cursor.x]] [[Cursor.y]] with an anchor point, something that will work like magnet in real life - for example user move their cursor by
How would I do that?
Instead of moving by the cursor position at a 1:1 ratio, move at a different ratio.
For example: [[cursor.y / 2]]
That will be a linear relationship, it looks like you want some kind of curve, but it’s too early in the morning for me to determine which formula fits that particular curve just from looking at those points you gave.
Thank you!
I’ve managed to get the linear movement in place, which works decently - getting a different speed ratio based on distance (for example creating 3 different bands) I think I can potentially work out.
The biggest problem I’m having is with anchoring the movable to a position…
Attached are:
Move the widget by negative cursor amount so it goes in the opposite direction.
[[-cursor.y / 2]]
I don’t know what you mean by anchoring it, unless what you mean is that gif, in which case the above should solve it. Also known as parallax, since they move by different apparent amounts based on implied distance from the viewer.
In the gif all the elements are doing the same thing, just scaled by different factors to give the illusion of depth.
Thank you for your time and your help so far, @nkrisc!
I don’t mind how it affects different element - apologies - I should’ve cropped the GIF better so that it focuses only on the relation between mouse pointer and the 2 birds pendant.
I have tried what you suggest (the negative cursor value) but it’s doing something weird - upon mouse enter to the desired area, it somehow resets the default “movable object”'s position to 0,0.
movable-object.rp (44.1 KB)
Wouldn’t “move by” always move the object diagonally in one direction?
If it was move by [[-cursor.x]] [[-cursor.y]], it would always keep moving the object to top left on page mouse move, and relatively, if it was move by [[cursor.x]] [[cursor.y]], it would keep moving the object to bottom right?
Move by moves the widget by a relative amount to its current position. Move to 10,10 moves it 10,10 on the page. Move by 10,10 moves it 10 pixels down and 10 pixels to the right from its current position.
Move by -20,10 moves it 20 pixels up and 10 pixels to the right from its current position.
If the cursor is left of the anchor the difference will be negative so negating it will give you a positive value moving the widget to the right.
I see what you’re saying though, and you’re right if we’re using cursor coordinates. What we really should be using then is the dragX and dragY variables which can be negative and are relative to the position of the mouse when the drag began.
If you’re not using a drag event then you’ll need to manually save those variables at the point of interaction in global variables and then use the difference of those variables and the corresponding cursor variable.
EDIT: on reflection I think this is what you meant by anchor point. In that case instead of cursor.x you need to use the difference.
[[-(cursor.x - anchorX) / 2]]
See if that that works. Either use a variable for the anchor or just hardcode a value.
If the cursor is to the left of the anchor the difference will be negative so negating it will move the widget to the right, opposite the cursor relative to the anchor.
Thank you so, so much!
Defining anchorX didn’t really help as it was auto-updating the position to its current, thus making the movement a bit wonky - but hardcoding it sort of works!
You mentioned we should be using dragX and dragY - is it only for dragging elements or it actually works for regular mouse movement too?
Cheers!
You could define anchorX and anchorY as global variables, that would basically be the same as hardcoding it but if you change it later it’d only have to be in one place, or you could even have other things update those variables. If they’ll never change, hardcoding is fine.
dragX and dragY are variables available in the different Drag events on widgets.
This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.
