14

I want to add an image to a Button (no imagebutton, as the particular button can either contain text or an image; plus the imagebutton has the same problem), while still retaining the original android-style button. So adding android:background in the XML doesn't cut it, as that will remove the android default button with rounded corners etc. (android.R.drawable.btn_default)

Is this in any way possible?

I think one way is to make a 9patch image for the button pressed (one for up and one for down) and onTouch Action_DOWN make a layered background drawable and put that onto the button, and doing the same thing but with another 9patch for onTouch Action_UP, but I think that will decrease the performance of the application substantially, as that will require quite a lot of resource reading and layer merging for all the button clicks (and for my application, that will be quite a lot). Is what I state above correct?

EDIT: I can't declare the source of the image in the XML, because I get the images from a web service, so anything can be put on the Buttons, but it has to happen programmatically.

2

5 Answers 5

29

This can be done using the android:drawableTop, android:drawableBottom, android:drawableLeft, android:drawableRight attributes in your layout.xml.

3
  • 2
    In code, you can use the - strangly named - method setCompoundDrawablesWithIntrinsicBounds(int, int, int, int) as described here: developer.android.com/reference/android/widget/…, int, int, int) <-- link is not linked correctly by SO...
    – Ridcully
    Sep 19, 2012 at 10:18
  • Just read that you get the images from a webservice, so you better use this method then: setCompoundDrawablesWithIntrinsicBounds (Drawable left, Drawable top, Drawable right, Drawable bottom). You can create the Drawables using Drawable.createFromStream(InputStream is).
    – Ridcully
    Sep 19, 2012 at 10:23
  • 1
    How can I resize images used like this? May 25, 2018 at 17:12
13

enter image description here

     <Button
            android:layout_width="0dp"
            android:layout_weight="1"
            android:background="@drawable/home_button"
            android:drawableLeft="@android:drawable/ic_menu_edit"
            android:drawablePadding="6dp"
            android:gravity="left|center"
            android:height="60dp"
            android:padding="6dp"
            android:text="AndroidDhina"
            android:textColor="#000"
            android:textStyle="bold" />
8

Set below Property of Button for Display Image with Text, using this property image is displaying above text.

<Button android:drawableTop="@drawable/ic_launcher"/>
2

For setting Image :

btn.setBackgroundResource(R.drawable.ic_launcher);

For setting text :

btn.setText("My Button");

Code :

private Drawable buttonDrawable;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    final Button btn=(Button) findViewById(R.id.button1);
    buttonDrawable=btn.getBackground();
    //Setting the image.
    btn.setBackgroundResource(R.drawable.ic_launcher);
    btn.setOnClickListener(new View.OnClickListener() {

        public void onClick(View v) {
            /*Removing image and setting text*/
            btn.setBackgroundDrawable(buttonDrawable);
            btn.setText("My Button");   
        }
    });
}
1
  • 1
    won't work, because I want to retain the Android styled buttons. when i set the background, the android original is gone and replaced for a potentially squared button. I want the image on/in the button, not instead of the original button layout Sep 19, 2012 at 9:54
0

You can create your own drawable with multiple states and set that to background

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" 
        android:drawable="@drawable/selected" />
    <item android:drawable="@drawable/normal" />
</selector>

Drawables can have rounded corners like so.

<corners android:topLeftRadius="5dp" android:topRightRadius="5dp"
         android:bottomLeftRadius="0.2dp" android:bottomRightRadius="0.2dp"/>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.