Image left of the text when button is bigger then the text

Question

I would like to create a button where an image is just left of the text even if the button is bigger then the text as shown below:

Sure, I can use

android:drawableLeft="@android:drawable/image"

but then the image is aligned to the left side of the button not to the left side of the text.

See if this helps: http://stackoverflow.com/a/8386510/833647 — Ken Wolf, Mar 04 '16 at 09:55
what if You set gravity="left" ? Does this overlap with the image? — Opiatefuchs, Mar 04 '16 at 09:56

score 0 · Accepted Answer · answered Mar 04 '16 at 10:04

0

Try this :

You can also have

android:weightSum="2"

or adjust layout_weight

<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    <ImageView
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="30dp"
        android:layout_gravity="start"
        android:background="@drawable/image"/>
    <TextView
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="30dp"
        android:padding="5dp"
        android:gravity="center_vertical"/>
</LinearLayout>

answered Mar 04 '16 at 10:04

Do that realy answer the question? There was a button we talking about. The problem is not having the image on the left side of the text. The problem is to have it AND in a button context. That is because we want to keep the click-animation. – Jan Seevers Mar 04 '16 at 10:12
You can also use a textview as a button. Not necessary always use a BUTTON as a button. Just add onClicklistener to a textview. And it acts as a button. – Mar 04 '16 at 10:18
The answer to your question is: you cannot do anything with a Button. Use other layouts, and make it animate on click. – Mar 04 '16 at 10:39
Nooooo dear !!! You can. I was just suggesting to use a TextView which can also act like a button. – Mar 04 '16 at 10:50

score 0 · Answer 2 · answered Mar 04 '16 at 10:05

Try these in yours XML layout:-

<LinearLayout
        android:layout_width="match_parent"
        android:gravity="center"
        android:background="@android:color/black"//PUT HERE BUTTON BACKGROUND RESOURCE
        android:orientation="horizontal"
        android:padding="10dp"
        android:layout_height="wrap_content">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/age_icon"//PUT HERE YOURS IMAGE
            />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Text is here"
            android:textColor="@android:color/white"
            />


    </LinearLayout>

Image left of the text when button is bigger then the text

2 Answers2