I’m currently working on incorporating a draggable background element into my project, which serves as a map backdrop for a mobile game. The objective is to allow users to navigate horizontally by dragging the map from left to right. However, the current implementation presents a challenge: when dragged, the map moves unrestrainedly and can extend beyond the boundaries of the screen. This poses usability issues and disrupts the overall user experience. I’m seeking guidance and suggestions on how to effectively address this problem.
My intention is to create a seamless navigation system reminiscent of those found in visual novel games, where specific areas are marked for exploration. Any advice on implementing constraints to confine the draggable map within the frame while maintaining smooth navigation would be greatly appreciated. Thank you in advance for your assistance.
Or use condition compare two numbers
And you compare FOR EXAMPLE (to block left side of map not going beyond left side of screen - so you can move map more to the left but as soon as left side of map hits left side of screen it stops dragging more to the right)
CameraBorderLeft() is GRATER than Map.BorderLeft()
There is extension called drag camera with mouse or touch
You can put your map on separate layer and drag camera there with mouse on touch
Now tricky part is that you technically CAN’T limit it perfectly
You need to make something that IF camera goes too far you push it back
So ideal solution would be CameraBorderLeft() is LESS than Map.BorderLeft()
You move your map to the left like idk 2 or 5 pixels or more or less
And you need to repeat same thing for each directions
I did it once i do not remember HOW exactly but these are things i do remember and that you need to pay attention to
And on top of that best tip i can give you
MAKE ONE just ONE side to block itself from moving further than you want
After that make opposite side to do the same
And sit on it as you can perfectly block your map on ONE axis both ways
After that doing it for other axis is simply using same values just for well other axis
BUT DO NOT try to make 2 sides at once and/or first one side on one axis then another side on other axis
You will have very bad time if you do
I know cause i did it and if you think it was funny then believe it was not
Thank you for your assistance. I apologize for my lack of familiarity with all the conditions and actions; I haven’t had the opportunity to use them extensively. I appreciate your patience as I continue to learn and explore their functionalities.
Just as a heads up, parallax scrolling is when multiple layers of images scroll around at different rates. Generally the further back the layer, the slower it scrolls. It’s the 80s way of simulating 3D sideways movements using sprites:
