Joystick Controls - Circular Boundary

[anon_32590642]

Hello all.

The joystick prefabs available in the Penelope tutorial and iPhone standard assets have a rectangular boundary. Basically what i want is to create a similar behaviour joystick (GUITextures) but with a circular boundary.
(similar to the controls in Minigore or Dungeon Hunter)

Can anyone give me any pointers on how to implement this? Im fairly new to scripting and could not find any example on my previous searches.

Thanks in advance

[anon_57407815]

@""

Hello all.

The joystick prefabs available in the Penelope tutorial and iPhone standard assets have a rectangular boundary. Basically what i want is to create a similar behaviour joystick (GUITextures) but with a circular boundary.
(similar to the controls in Minigore or Dungeon Hunter)

Can anyone give me any pointers on how to implement this? Im fairly new to scripting and could not find any example on my previous searches.

Thanks in advance

Basically to create a circular boundary you just need to limit the distance from a center point to a certain Radius.

So you need to do something like :

var pivot : Vector3;  // set this in the editor to be your center point
var radius : float = 10.0; // the radius of the circle
var point : Vector3; 
var pointRelatedToPivot : Vector3; // use this to avoid doing the calculation twice

point = someTransform.position; // the location of the handle
pointRelatedToPivot = pivot-point;
if( pointRelatedToPivot.sqrMagnitude>Mathf.Pow(radius,2)){  // i am using sqrMagnitude instead of magnitude since it’s cheaper
    point = pivot + pointRelatedToPivot.normalized*radius;
}
someTransform.position = point;

[tiago]

That saved me a few months of banging my head against a wall

[anon_32590642]

@""

Basically to create a circular boundary you just need to limit the distance from a center point to a certain Radius.

So you need to do something like :

var pivot : Vector3;  // set this in the editor to be your center point
var radius : float = 10.0; // the radius of the circle
var point : Vector3; 
var pointRelatedToPivot : Vector3; // use this to avoid doing the calculation twice

point = someTransform.position; // the location of the handle
pointRelatedToPivot = pivot-point;
if( pointRelatedToPivot.sqrMagnitude>Mathf.Pow(radius,2)){  // i am using sqrMagnitude instead of magnitude since it’s cheaper
    point = pivot + pointRelatedToPivot.normalized*radius;
}
someTransform.position = point;

UVRadiation, thanks for your help mate. Was totally lost on how to set this up. /Cheers

[anon_14239132]

I was able to utilize the code sample from above to set a circular boundary for the penelope joystick controls instead of the default square boundary; however, when the joystick texture gets to the border/perimeter of the circle, it snaps back to its center. Has anyone else encountered this issue?

Thank you.

[Pheck]

I already solved this also… well kinda. there is a small bug in mine but i have not found the time to fix it yet.

the basic of what i did is to calculate the distance between the “zero” location and the touch location. then if the distance is larger than X it puts the visual back at the extents. the bug in my system right now is how it puts it back at the extents. it works well but not perfect so i want to make it better.

[anon_42335884]

Could someone post their joystick with circular boundary. Not going so well here

[anon_614556]

Seriously UVRadiation, thanks so much for this, I have been beating my head against a wall for 3 days now.