Detecting if a MouseEvent from onTouch is inside a circle drawn to the canvas of a custom view.

Question

I'm trying to start with an android application and before that I have a need to do the following thing : I have a class extending from the View class and Implementing the View.onTouchListener interface. Now, I have drawn a circle in the onDraw() method so that the circle appears on the start of the application. Now, I would want to do something when the user touches(Actually clicks) the circle. So, the first thing I'm trying to do here is to display a toast msg on the touch of the circle. I tried using the following code but nothing happened. Pls help me find a solution.

This is the View class :

    package com.exam.trial;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Toast;

public class pad extends View implements View.OnTouchListener{

Paint paint;
public pad(Context context) {
    super(context);
    // TODO Auto-generated constructor stub
    paint = new Paint();
}


public boolean onTouch(View v, MotionEvent event) {
switch(event.getAction()){
    case MotionEvent.ACTION_DOWN: {
        if (event.getX()>70 && event.getX()<130 && event.getY()>70 && event.getY()<130)
        {
            Toast toast = Toast.makeText(getContext(), "Works fine", Toast.LENGTH_SHORT);
            toast.show();
        }
        return true;
    }

}
return false;
}


@Override
public void onDraw(Canvas canvas)
{
    paint.setColor(Color.YELLOW);
    canvas.drawCircle(100, 100, 50, paint);
}

}

And here is my starting activity :

package com.exam.trial;

import android.app.Activity;
import android.os.Bundle;

public class TrialActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    pad p = new pad(this);

    setContentView(p);
}
}

Answer 1

The onTouch callback will capture any finger touches on the view as raw X/Y coordinates. If you want to tell if the user tapped on a circle thats in the view, you will have to determine if the given X/Y coordinates are inside the circle.

Here's a simple function for that:

private boolean inCircle(float x, float y, float circleCenterX, float circleCenterY, float circleRadius) {
    double dx = Math.pow(x - circleCenterX, 2);
    double dy = Math.pow(y - circleCenterY, 2);

    if ((dx + dy) < Math.pow(circleRadius, 2)) {
        return true;
    } else {
        return false;
    }
}

You will want to modify your code so that the the center x,y positions of the circle are class fields, and update your onTouch method accordingly:

private float mCircleCenterX;
private float mCircleCenterY;
private float mCircleRadius;

public boolean onTouch(View v, MotionEvent event) {
    switch(event.getAction()){
        case MotionEvent.ACTION_DOWN:
            if (inCircle(event.getX(), event.getY(), mCircleCenterX, mCircleCenterY, mCircleRadius)) {
                Toast toast = Toast.makeText(getContext(), "Works fine", Toast.LENGTH_SHORT).show();
            }
            return true;
    }
    return false;
}

Answer 2

use this:

p.setFocusable(true);
p.setOnTouchListener(p);

Answer 3

Please add the following code to make the view focusable meaning it can be touched, and set the ontouch listener to your new pad p that you constructed. something like,

setFocusable(true);
setOnTouchListener(p);