android - How to make a bitmap using canvas clickable?

Question

How do i make the bitmap created clickable? Below is the code which i have used to create a bitmap using canvas.

 public class DrawView extends View implements OnClickListener
{
    public DrawView(Context context)
    {
        super(context);
        paint = new Paint();
        image = BitmapFactory.decodeResource(getResources(), R.drawable.andmrktsmall);
    }

    @Override
    protected void onDraw(Canvas canvas)
    {
        super.onDraw(canvas);
        int canWidth = canvas.getWidth();
        int canHeight = canvas.getHeight();
        int width = (canWidth - 200) / 2;
        int height = (canHeight - 100) / 2;
        Bitmap indexcanvas = Bitmap.createScaledBitmap(image, 200, 100, true);
        canvas.drawBitmap(indexcanvas, width, height, paint);
        this.setBackgroundColor(Color.YELLOW);

    }

    @Override
    public void onClick(View v)
    {
        Toast.makeText(context, "View is clicked", 1).show();
    }

}

Answer 1

By setting an OnClickListener on this view, all of it will be clickable (though not limited to your bitmap). To check whether or not the user clicked only the bitmap itself you have to override onTouchEvent(MotionEvent event) and check if the touch coordinates are the same as the bitmap.

@Override
public boolean onTouchEvent(MotionEvent event)
{
    float x = event.getX();
    float y = event.getY();
    switch(event.getAction())
    {
        case MotionEvent.ACTION_DOWN:
        //Check if the x and y position of the touch is inside the bitmap
        if( x > bitmapXPosition && x < bitmapXPosition + bitmapWidth && y > bitmapYPosition && y < bitmapYPosition + bitmapHeight )
        {
            //Bitmap touched
        }
        return true;
    }
    return false;
}

Just replace bitmapXPosition and bitmapYPosition with the coordinates you use to draw the bitmap, and bitmapWidth and bitmapHeight with the width and height you use to draw it.

Also, try not to allocate memory (create objects) inside the onDraw() method of any view. It is bad for perfomance.

EDIT

private Rect r;
private Paint paint;
Bitmap bitmap;

public TestRect(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    paint = new Paint();
    paint.setColor(Color.BLUE);
    r = new Rect();
    bitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.ic_launcher);
}

public TestRect(Context context, AttributeSet attrs) {
    super(context, attrs);
    paint = new Paint();
    paint.setColor(Color.BLUE);
    r = new Rect();
    bitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.ic_launcher);
}

public TestRect(Context context) {
    super(context);
    paint = new Paint();
    paint.setColor(Color.BLUE);
    r = new Rect();
    bitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.ic_launcher);
}

@Override
public void onDraw(Canvas c)
{

    r.set(getWidth()/2, getHeight()/2, getWidth()/2 + 200, getHeight()/2 + 200);
    //c.drawRect(r, paint);
    c.drawBitmap(bitmap, null, r, paint);
}

@Override
public boolean onTouchEvent(MotionEvent event)
{
    float x = event.getX();
    float y = event.getY();
    switch(event.getAction())
    {
        case MotionEvent.ACTION_DOWN:
        //Check if the x and y position of the touch is inside the bitmap
        if( x > getWidth()/2 && x < getWidth()/2 + 200 && y > getHeight()/2 && y < getHeight()/2 + 200 )
        {
            Log.e("TOUCHED", "X: " + x + " Y: " + y);
            //Bitmap touched
        }
        return true;
    }
    return false;
}

By drawing the bitmap using a Rect as your coordinates you can check if the touch is inside the bitmap or not. Also, instead of that big and ugly "if" statement, you can use

if(r.contains(x, y))
{
     //BITMAP TOUCHED
}