CODEWITHSUNDEEP
androidandroid-layoutimagebutton
Henrique
Henrique

Reputation: 5011

Image and Text button with transparent background

I'm trying to get a button to look like the one at the link I've posted below.

It's a transparent button with image at the top and text on the bottom. When a click occurs, the whole bounding box gets highlighted.

This is how the button looks like when pressed: http://i44.tinypic.com/24nle9e.png

Not sure if this effect is achieved with a Button or an ImageButton. Any ideas? Thanks.

Upvotes: 0

Views: 1971

Answers (3)

Brayden
Brayden

Reputation: 1795

By the looks of it, it appears the image you're showing is an ImageButton with the image being a PNG image with transparent sections throughout it. If you want to keep the button selected you should be able to mess with the button parameters:

android:state_selected = "true"

Try that.

Upvotes: 0

Christo
Christo

Reputation: 38

dor506's answer is basically correct, but I'd use a ImageButton instead of a Button, and set it's background to transparent (android:background="#00000000" - the 0 alpha is the key bit here) before applying your Drawable via android:src="@drawable/your_drawable_id".

In case this helps, here is an example of a suitable Drawable:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/button_hi" /> <!-- pressed -->
    <item android:drawable="@drawable/button_lo" /> <!-- default -->
</selector>

where 'button_hi' / 'button_lo' are the two images you are switching as a result of a click.

Upvotes: 2

dor506
dor506

Reputation: 5404

I don't think you can achieve this result with button/imagebutton properties.

here's a simple solution: you can create two images, one for the button when it isn't clicked, and one for the button when it is clicked (with the orange color behind..)

then you should create a selector. it is an xml which handle click/non click/focus image behaviour.

finally give the button the background of the selector

        <Button android:layout_width="wrap_content" android:background="@drawable/selector" 
        android:layout_height="wrap_content" />

Upvotes: 0

Related Questions