Prevent Object from going out of Circle Radius


I’m trying to achieve this:

I have an object that follows my finger/mouse when I’m within the green area. However, when I drag my finger/mouse into the red area I don’t want the object to follow exactly my finger/mouse location anymore, although I do want it to continue to move within the green area. Does that make sense? Almost like a movement cap.

I’m using simple collision raycaster:

object.transform.position.x = _dragger.hit.point.x;
object.transform.position.y = _dragger.hit.point.y;

How would I go about preventing the object from going out of the green bound? (The bounds are just circles will collisions).


I can think of 2 methods:

1 - You know the green circle radius and know the black circle radius. Every time you update the black circle position check if the position plus the black radius is greater than the green radius. If it is, move it inside the green circle in an imaginary line that goes from the finger to the center of the green circle.

2 - Get the position vector relative to the center of the green circle. Normalize that vector and multiply it by “green radius - black radius”. Convert that normalized vector back to world position and set it as the position of the black circle.

I think I prefer the second method since it looks more clean, but I haven’t tested them, maybe one is faster than the other.

Get the vector that is from the center of the circles to your mouse position. Normalize this vector and multiply the max distance (inner circle radius). Position the object to the center and add the pre-calculated direction.

My answer doesn’t sound very clear, even to me. Maybe showing in code will clarify things:

public Transform _Center;       // The very center of the circles
public Transform _Object;       // Transform of the object that follows mouse
float maxDistance = 3f;         // Max distance that the object can be from the center

 Vector3 screenPointCenter = Camera.main.WorldToScreenPoint(_Center.position);
 _Object.position = _Center.position + (Input.mousePosition - screenPointCenter).normalized * maxDistance;

You can get a direction vector.
<pre> // This is the direction of the finger/mouse. Vector2 direction = fingerMousePosition - centerPosition. </pre>
And given the float radius of the circle (slightly smaller than the green circle to specify the center and not the outside);
You can set the position of the clamped black circle to:
<pre> Vector2 blackCirclePosition = centerPosition + (direction.Normalized * radius); </pre>

This logic can be conditional to when your finger/mouse gets too far.
<pre> if (direction.Magnitude >= radius) { // all that stuff here } </pre>