How to add an image to a button on Android - ImageButton

Creating a button that contains a glyph (image) and text, frequently referred as ImageButton, can be done entirely in the layout XML file using the attribute android:drawableTop.

For example, you can use Android stock images combined with your own text like this:

 <Button
  android:id="@+id/btnUp"        
  android:layout_width="200dp"
  android:layout_height="wrap_content"
  android:drawableTop="@android:drawable/arrow_up_float"
  android:text="Click here to go up"/>

  <Button
  android:id="@+id/btnDown"
  android:layout_width="200dp"
  android:layout_height="wrap_content"
  android:drawableTop="@android:drawable/arrow_down_float"
  android:text="Click here to go down"/>

You can also use your own resource image. In this case, I added the file ball.png to the drawable folder

<Button        
android:layout_width="200dp"        
android:layout_height="wrap_content"        
android:drawableTop="@drawable/ball"
android:text="Kick off!"/>

And here how they look like