CODEWITHSUNDEEP
android
Inx
Inx

Reputation: 2384

Round button in android.. avoid presses "outside" the button?

I have created/tried to create, a round button for android by using the ImageButton "widget". But since that type of button is treated as a square and my png-image also is treated as a square with a transparent background, then how do I avoid the user from beeing able to press outside the round button?.. cause as for now.. they can press in the "corners" of the button and that will still trigger the click-event.. Is there any speciall mapping-layer that can be done in photoshop or any way to change the radius of the image button so it fits to the "roundness" of my image.. or any ideas?

Thanks in advance!.. and sorry for poor english..

Upvotes: 7

Views: 1777

Answers (2)

JstnPwll
JstnPwll

Reputation: 8685

I was using an ImageView as my circle button, and I needed to make some changes to @Daniel's code to make it work the way I wanted. Here's my code:

private boolean mStillDown = false;

public boolean inCircle(MotionEvent e, float radius, float x, float y) {
    float dx = e.getX() - x;
    float dy = e.getY() - y;
    double d = Math.sqrt((dx * dx) + (dy * dy));
    if(d < radius)
        return true;
    return false;
}

@Override
public boolean onTouchEvent(MotionEvent event) {

    int action = event.getAction();
    boolean inCircle = inCircle(event, getWidth()/2.0f, getWidth()/2.0f, getHeight()/2.0f);

    if(inCircle){
        if(action == MotionEvent.ACTION_DOWN || action == MotionEvent.ACTION_POINTER_DOWN){
            this.setPressed(true);
            mStillDown = true;
        }else if(action == MotionEvent.ACTION_UP || action == MotionEvent.ACTION_POINTER_UP){
            if(this.isPressed()){
                this.performClick();
                this.setPressed(false);
                mStillDown = false;
            }
        }else if(action == MotionEvent.ACTION_MOVE && mStillDown){
            this.setPressed(true);
        }
    }else{
        if(action == MotionEvent.ACTION_MOVE){
            this.setPressed(false);
        }else if(action == MotionEvent.ACTION_UP || action == MotionEvent.ACTION_POINTER_UP || action == MotionEvent.ACTION_OUTSIDE){
            mStillDown = false;
        }
    }

    return true;
}

Hopefully this is useful to someone.

Upvotes: 2

SlowDeepCoder
SlowDeepCoder

Reputation: 882

Try Pythagorean theorem and onTouch, simple and easy way to do it.

public boolean inCircle(MotionEvent e, int radius, int x, int y) {
    int dx = e.x - x;
    int dy = e.y - y;
    double d = Math.sqrt((dx * dx) + (dy * dy));
    if(d < radius)
        return true;
    return false;
}

the x, y is the posision of the circle, the radius is the radius, and the e is the TouchEvent you have.

@Override
public boolean onTouch(View arg0, MotionEvent arg1) {
    if(arg1.getAction() == MotionEvent.ACTION_DOWN){
           if(inCircle(arg1, radius, xCircle, yCircle){
                  //do whatever you wanna do here
                  }
            }
    return false;
}

Upvotes: 5

Related Questions