Joystick ellipse movement (2d mobile asset modification)

Questions & Answers
1

This is a question that relates to this post here:

This code is a modification of the default 2d sidescroller joystick included with Unity 3.

I’m trying to accomplish the same thing that the person in that post is (I’m assuming). I’m almost there, but not quite.

By default, the joystick moves inside of a square. An invisible boundary Rect. I’m trying to modify this so that it moves inside that same rect, but is clamped to a circle. So instead of the joystick graphic jamming into corners, we have it moving around the outside of the circle if the user is moving in that direction.

So far, I do have the joystick moving in a circular pattern, but only in the top right-hand portion of the circle. In other words, the center is at 0,0, at the bottom left of the screen. The joystick is moving around that center, but the center should be where the joystick’s default snap-back position is. I can’t for the life of me figure out where in my code it’s getting the 0,0 coordinates from.

Initialization code:

function Start()
{
// Cache this component at startup instead of looking up every frame	
joystickGui = GetComponent( GUITexture );

// Store the default rect for the gui, so we can snap back to it
// when player is not touching the joystick
defaultRect = joystickGui.pixelInset;

defaultRect.x += transform.position.x * Screen.width;
defaultRect.y += transform.position.y * Screen.height;

transform.position.x = 0.0;
transform.position.y = 0.0;

defPosition = position;	

// This is an offset for touch input to match with the top left
// corner of the GUI
guiTouchOffset.x = defaultRect.width * 0.5;
guiTouchOffset.y = defaultRect.height * 0.5;

// Cache the center of the GUI, since it doesn't change
guiCenter.x = defaultRect.x + guiTouchOffset.x;
guiCenter.y = defaultRect.y + guiTouchOffset.y;

// Let's build the GUI boundary, so we can clamp joystick movement
guiBoundary.min.x = defaultRect.x - guiTouchOffset.x;
guiBoundary.max.x = defaultRect.x + guiTouchOffset.x;
guiBoundary.min.y = defaultRect.y - guiTouchOffset.y;
guiBoundary.max.y = defaultRect.y + guiTouchOffset.y;    
}

Broken code under Update()

		if ( lastFingerId == touch.fingerId )
		{	
			// Override the tap count with what the iPhone SDK reports if it is greater
			// This is a workaround, since the iPhone SDK does not currently track taps
			// for multiple touches
			if ( touch.tapCount > tapCount ){
				guiTouchPos = Vector2.ClampMagnitude(guiTouchPos,100);
				clampedPos.x = Mathf.Clamp(guiTouchPos.x,guiBoundary.min.x,guiBoundary.max.x);
				clampedPos.y = Mathf.Clamp(guiTouchPos.y,guiBoundary.min.y,guiBoundary.max.y);
				
				var distance: float=Vector2.Distance(guiCenter,clampedPos);
				
				if(distance<200)
				{    
				joystickGui.pixelInset.x=clampedPos.x;
				joystickGui.pixelInset.y=clampedPos.y;
				}
			}
			
			if ( touch.phase == TouchPhase.Ended || touch.phase == TouchPhase.Canceled )
				ResetJoystick();					
		}
2

//you need two round texture one for boundary are which is bigger then 2nd texture which will //be touch and drag for controlling

public class JoyStick : MonoBehaviour {

public Texture areaTexture;
public Texture touchTexture;
public Vector2 joystickPosition = new Vector2( 135f,135f);
public Vector2 speed = new Vector2(2,100);
public float zoneRadius=100f;
public float touchSize = 30;
public float deadZone=20;
public float touchSizeCoef=0;
protected Vector2 joystickAxis;
protected Vector2 joystickValue;
public Vector2 joyTouch;
private Vector2 _joystickCenter;
[SerializeField]
private Vector2 _smoothing = new Vector2(20f,20f);
public Vector2 Smoothing 
{
    get {
       return this._smoothing;
    }
    set {
       _smoothing = value;
       if (_smoothing.x<0.1f){
         _smoothing.x=0.1f;
       }
       if (_smoothing.y<0.1){
         _smoothing.y=0.1f;   
       }
    }
}
private int _joystickIndex=-1;
private bool _enaReset;
private bool _enaZoom;
 
void Start () 
{
    _joystickCenter = joystickPosition;
    _enaReset=false;
}

void Update () 
{
       if (Application.platform == RuntimePlatform.IPhonePlayer || Application.platform == RuntimePlatform.Android) 
		{
	       foreach (Touch touch in Input.touches)
	       {
	         if (touch.phase == TouchPhase.Ended || touch.phase == TouchPhase.Canceled) 
			 {
	          	if (_joystickIndex==touch.fingerId){
	              _joystickIndex=-1;
	              _enaReset=true;
	          	}
	         }
	 
	         if(_joystickIndex==touch.fingerId)
			 {
	          	OnTouchDown(touch.position);
	         }
	         if (touch.phase == TouchPhase.Began)
			 {
	         	 if (((Vector2)touch.position - _joystickCenter).sqrMagnitude < Mathf.Pow((zoneRadius+touchSizeCoef/2),2))
			  	  {
	              	_joystickIndex = touch.fingerId;
	         	 }
	         }
       }
 
       UpdateJoystick();
       if(_enaReset)
		{
        	 ResetJoystick();
       	}
    }
	else
	{ 
       if (Input.GetButtonUp ("Fire1")) 	
		{
         	_joystickIndex=-1;
         	_enaReset=true;
       }
       if(_joystickIndex==1)
		{
         	OnTouchDown(Input.mousePosition);
        }
        if (Input.GetButtonDown ("Fire1") ) 
		{
	         if (((Vector2)Input.mousePosition - _joystickCenter).sqrMagnitude <Mathf.Pow( (zoneRadius+touchSizeCoef/2),2))
			 {
	         	 _joystickIndex = 1;
	 
	         }
	 
       }
       if(_enaReset)
		{
         	ResetJoystick();
       	}
 
       UpdateJoystick();
 
    }
 
}
 



private void UpdateJoystick()
	{ 
       if (joyTouch.sqrMagnitude>deadZone*deadZone)
		{
 
         joystickAxis = Vector2.zero;
      	 if (Mathf.Abs(joyTouch.x)> deadZone)
		  {
         	 joystickAxis = new Vector2( (joyTouch.x -(deadZone*Mathf.Sign(joyTouch.x)))/(zoneRadius-touchSizeCoef-deadZone),joystickAxis.y);
 
          }
		 else
		 {
          	joystickAxis = new Vector2( joyTouch.x /(zoneRadius-touchSizeCoef),joystickAxis.y);
 
         }
       if (Mathf.Abs(joyTouch.y)> deadZone)
		{
 			joystickAxis = new Vector2( joystickAxis.x,(joyTouch.y-(deadZone*Mathf.Sign(joyTouch.y)))/(zoneRadius-touchSizeCoef-deadZone));
        }
		else{
          joystickAxis = new Vector2( joystickAxis.x,joyTouch.y/(zoneRadius-touchSizeCoef));  
         }
 
       }
       else{
         joystickAxis = new Vector2(0,0);
       }
    Vector2 realvalue = new Vector2(  speed.x*joystickAxis.x,speed.y*joystickAxis.y);
    joystickValue=realvalue;
    print(realvalue);
 
}

void OnTouchDown(Vector2 position)
	{
       joyTouch  = new Vector2( position.x, position.y) - _joystickCenter;
       if ((joyTouch/(zoneRadius-touchSizeCoef)).sqrMagnitude > 1)
		{
         joyTouch.Normalize();
         joyTouch *= zoneRadius-touchSizeCoef;
       }
    //print(joyTouch);
 }


private void ResetJoystick()
{
    if (joyTouch.sqrMagnitude>0.1)
	{
       joyTouch = new Vector2( joyTouch.x - joyTouch.x*_smoothing.x*Time.deltaTime, joyTouch.y - joyTouch.y*_smoothing.y*Time.deltaTime);    
    }
    else{
       joyTouch = Vector2.zero;
       _enaReset=false;
    }
}
void OnGUI()
{
       GUI.DrawTexture( new Rect(_joystickCenter.x -zoneRadius ,Screen.height- _joystickCenter.y-zoneRadius,zoneRadius*2,zoneRadius*2), areaTexture,ScaleMode.ScaleToFit,true);
       GUI.DrawTexture( new Rect(_joystickCenter.x+(joyTouch.x -touchSize) ,Screen.height-_joystickCenter.y-(joyTouch.y+touchSize),touchSize*2,touchSize*2), touchTexture,ScaleMode.ScaleToFit,true);
}

}