Creating two custom buttons

Question

Can some one please help me on creating custom buttons like below? Is it possible? Have searched a lot and was able to find only some things which again turn out to be rectangular/square shapes. But I want two buttons to be triangular and to be arranged on up on the other and clickable only on their particular occupied areas. Code snippets are appreciated.

Phocaea

Its possible in logical way by creating an image that look like the above picture. Because you can't re-shape the command buttons. – Condemnation

@Condemnation But if we create an image, the how can the click events be separated on their respective shapes? – Phocaea

how do you do for solve this problem? I have this question [here][1] [1]: #19797930 – Liberticide

Answer 1

You can do that by extending View and subclassing its onTouchEvent method, like this

public class BottomLeftTriangleButton extends View {

    // Copy superclass contructors

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (event.getX() / getWidth() < event.getY() / getHeight()) {
            return super.onTouchEvent(event);
        }
        return false;
    }

}

This way, your custom view only intercept clicks on the bottom left area, corresponding to your "button 2" area. You can make the other area clickable by changing the "<" sign to ">".

Then put your 2 views in the same FrameLayout, and you're done.

Breathe

Can you please elaborate on how to create triangular buttons and arrange up on one another like in the image above? – Phocaea

Put your 2 custom buttons in the same FrameLayout, and set android:background for both of them to your button images. There is no default resource for triangle buttons, you'll have to do the images yourself. You can use a State List to use different images for pressed and normal states. – Breathe

Thanks for your time. My question is how to prepare those kind of custom buttons. – Phocaea

I don't understand what you mean by "prepare"? Add your custom views in your XML and you're good to go. – Breathe