DEV Community

Cover image for Android: Button with Both Image and Text
Gaute Meek Olsen
Gaute Meek Olsen

Posted on • Edited on • Originally published at gaute.dev

1 1

Android: Button with Both Image and Text

Let's say you want a button to show an image with accompanying text. Do you then add two views, align them together and have two click listeners?

No there is an easier way.

<?xml version="1.0" encoding="utf-8"?>
<Button 
android:text="Start" 
android:drawableTop="@drawable/start_wrap" 
android:drawableTint="@android:color/white" 
android:drawablePadding="10dp" 
android:background="@android:color/transparent" 
android:textColor="@android:color/white"/>
Enter fullscreen mode Exit fullscreen mode

Add a drawable to the button like this. And if you want to change the size, I like to create a drawable wrapper which is responsible for sizing. Like this:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
  <item 
  android:drawable="@drawable/baseline_camera_enhance_24" 
  android:width="40dp" 
  android:height="40dp" 
  /> 
</layer-list > 
Enter fullscreen mode Exit fullscreen mode

That is all, simple and easy

Qodo Takeover

Introducing Qodo Gen 1.0: Transform Your Workflow with Agentic AI

While many AI coding tools operate as simple command-response systems, Qodo Gen 1.0 represents the next generation: autonomous, multi-step problem-solving agents that work alongside you.

Read full post

Top comments (0)

Billboard image

Create up to 10 Postgres Databases on Neon's free plan.

If you're starting a new project, Neon has got your databases covered. No credit cards. No trials. No getting in your way.

Try Neon for Free →