Create a Button with an Image and Text [Android]

The Android SDK docs aren’t very helpful. Period. More specifically, they aren’t clear on how to create a button with both an image and text. Allow me to help.

Place the following in your layout XML file, replacing [image] with your image:

<Button
     android:id="@+id/groups_button_bg"
     android:layout_height="wrap_content"
     android:layout_width="wrap_content"
     android:text="Groups"
     android:drawableTop="@drawable/[image]" />

Using android:drawableTop="@drawable/...", we’re able to place an image above the button text. The following options are available for placing the image in different positions relative to the button text:

android:drawableLeft
android:drawableRight
android:drawableBottom
android:drawableTop

In addition, android:drawablePadding can be used to specify the amount of padding between the image and button text.