Is it possible to change the size of icon inside EditText

Question

I am creating a login window with username and password fields and in each I would like to put icons. When I add icon to EditText field I cannot change the size of icon.

Icon is inside EditText field because I want to change EditText background when it is focused.

I tried to put icon and EditText view inside LinearLayout, but I couldn't change layout background when EditText is focused.

My EditText code:

<EditText
    android:id="@+id/user_name_edit_text"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="35dp"
    android:layout_marginRight="35dp"
    android:layout_marginTop="35dp"
    android:background="@drawable/custom_border_selector"
    android:drawablePadding="5dp"
    android:hint="@string/username"
    android:singleLine="true"
    android:textColor="#757575"
    android:textSize="15sp"
    android:drawableLeft="@drawable/ic_person_grey_24dp"
    />

EditText visual:

Check this link:http://stackoverflow.com/questions/20250638/how-to-create-edittext-hint-as-text-with-image-in-android — Mrunal, Feb 26 '16 at 11:30
@Rohit5k2 It will sound stupid of me, but I didn't think of that, thanks. One more question, I couldn't find method for adding padding or margin for the image? I tried to google it, a few hours and no useful info. — JonasSeputis, Feb 26 '16 at 11:32

score 19 · Answer 1 · answered Feb 26 '16 at 11:52

In case you'd like to solve the problem in xml, here's sample code where you can manipulate your image size/padding:

<!-- USERNAME INPUT -->
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/edit_text_selector">

    <!-- INPUT -->
    <EditText
        android:id="@+id/username_input"
        android:layout_marginLeft="-10dp"
        android:layout_toRightOf="@+id/username_icon"
        android:text=""
        android:hint="Username"
        android:padding="10dp"
        android:background=""
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

    <!-- ICON -->
    <ImageView
        android:padding="3dp"
        android:id="@+id/username_icon"
        android:src="@drawable/perm_group_personal_info"
        android:layout_width="40dp"
        android:layout_height="40dp" />

</RelativeLayout>

And here is how it looks like:

score 7 · Accepted Answer · answered Feb 26 '16 at 11:37

You can change the icon and use a smaller one on focus. This is the method you should use.

public void setCompoundDrawablesWithIntrinsicBounds (
                                       int left, int top, int right, int bottom)

Sets the Drawables (if any) to appear to the left of, above, to the right of, and below the text. Use 0 if you do not want a Drawable there. The Drawables' bounds will be set to their intrinsic bounds.

Now to add padding you can use this

 public void setCompoundDrawablePadding (int pad)

Sets the size of the padding between the compound drawables and the text.

Related XML Attributes:

android:drawablePadding

More information here and here. There are many other methods you might find interesting.

score 1 · Answer 3 · edited Mar 03 '21 at 08:02

A better way than setting by java would be by setting It inside a layered drawable as follows.

Layered list drawable is as under :

    <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item

        >
        <shape>
            <solid android:color="@color/bg_row_drop_completed"/>
            <size android:width="96dp"
                />
            <padding android:top="-15dp"
                android:bottom="-15dp"/>
            <corners android:topLeftRadius="@dimen/btn_add_bg_radius_purple" android:topRightRadius="@dimen/btn_add_bg_radius_purple"/>
        </shape>
    </item>
    <item
        >
        <bitmap android:src="@drawable/_ic_arrow_drop_up_normal" android:gravity="center_vertical"
            ></bitmap>
    </item>
</layer-list>

see example image

Is it possible to change the size of icon inside EditText

3 Answers3

Linked