Question

I’m trying to simulate an analog stick on a mobile platform.

I calculate a stick vector which based on the position of the finger and the radius of the stick returns a value from -1 to 1.

public void calcStickVector(float x, float y)
{
    float cx = getCenterX();
    float cy = getCenterY();

    float distX = x - cx;
    float distY = y - cy;
    distX /= getRadius();
    distY /= getRadius();

    distX = JMath.clamp(-1.0f, 1.0f, distX);
    distY = JMath.clamp(-1.0f, 1.0f, distY);
    stickVector.x = distX;
    stickVector.y = distY;
}

public RectF getInnerStickRect()
{
    float r = getInnerRadius();
    float cx = getCenterX() + (getRadius() * getStickVector().x);
    float cy = getCenterY() + (getRadius() * getStickVector().y);

    innerStickRect.left = cx - r;
    innerStickRect.top = cy - r;
    innerStickRect.right = cx + r;
    innerStickRect.bottom = cy + r;

    return innerStickRect;
}

It almost works, but visually the inner stick, when moved around seems to form a square rather than going around in a circle. Is there something wrong with my logic?

Thanks

Answer 1

As it is, you really are making a box with 1’s as the corners. You need to normalize the vector(divide x and y by distance) instead of dividing by radius and clamping.

double dist = Math.sqrt(distX*distX) + (distY*distY));
distX /= dist;
distY /= dist;