CODEWITHSUNDEEP
androidxmllayout
Robin
Robin

Reputation: 577

Add an image in the middle of button?

So I have created a button in my layout, but I wanted it to be a circle. So I created an .xml drawable like this - 

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="#673ab7"/>
    <stroke android:width="2sp" android:color="#fff" />
</shape>

Then in the button bit in the layout i added this

android:background="@drawable/circle_button"

But now I wish to have an image inside the circler button. How can I achieve this? Can I simply add something in the drawable xml?

I've tried searching for answers but I am confused to what I should search for.

Upvotes: 1

Views: 3199

Answers (3)

Zar E Ahmer
Zar E Ahmer

Reputation: 34380

The easiest way is to create a RelativeLayout instead of button and put your image inside the layout and set its attribute android:layout_centerInParent="true" to true;

so it will be in the middle of the RelativeLayout. And set the android:background="@drawable/circle_button" to the RelativeLayout. Now get the RelativeLayout using it id and add a click listener to RelativeLayout

Upvotes: 1

VVB
VVB

Reputation: 7641

Why don't you go for relativelayout. Just take relative layout having circle shaped image to its background. Only the thing is you need circle shaped image.

For example,

    <RelativeLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/circle">  //circular shaped image circle.png
    </RelativeLayout>

Finally you just have to apply listener to your layout. This will solve your problem.

Upvotes: 1

A.Vynohradov
A.Vynohradov

Reputation: 276

Try following:

<ImageButton
        android:id="@+id/imgBtn"
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:background="@drawable/circle_button"
        android:src="@drawable/image_to_insert"
        android:adjustViewBounds="true"
        android:scaleType="fitCenter" />

Upvotes: 4

Related Questions