Scorpion
Scorpion

Reputation: 6901

Set Image on Left side of EditText in Android

I am having one contact form in which I would like to add some icons to my edit text for a better look. I want to create EditText something like below.

enter image description here

I have EditText like below. And I got the result something like. I want the image to be absolutely on the left side as it is in the above image. I know that internally EditText is using Nine Patch image and i think that is why the result is some what different. Can anyone know how to resolve this?

enter image description here

<EditText
            android:id="@+id/name"
            android:layout_width="fill_parent"
            android:layout_height="51dip"
            android:hint="@string/name"
            android:inputType="text"
            android:drawableLeft="@drawable/name_icon_edittext" />

Upvotes: 18

Views: 44485

Answers (4)

Milind
Milind

Reputation: 31

You can use android:drawablePadding="10dp" property in the xml file. There's no need to create separate imagview for the icon.

Upvotes: 3

Faris Jameel
Faris Jameel

Reputation: 616

if you want to add some space between you text and image then use'drawablePadding' property in xml

android:drawablePadding="10dp"

here is complete example how to use in edittext in xml file

             <EditText
                android:id="@+id/edittext"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:drawableLeft="@drawable/ic_left"
                android:drawablePadding="10dp" />

Upvotes: 15

Armando
Armando

Reputation: 485

A bit old, but for future reference maybe:

I would do a 9-patch image myself with the appearance you want, keeping the proportions and all but the icon, so you can add it yourself (and reuse the background) with drawableLeft property of EditText. That way only the middle part of the image will be stretched but the rest will stay the same.

Upvotes: 0

Tomer Mor
Tomer Mor

Reputation: 8028

Instead of using android:drawableLeft="@drawable/name_icon_edittext", create separateImageView for the name_icon. This way you have more control on placing it on the layout

Note: I am assuming your layout is RelativeLayout

Upvotes: 20

Related Questions