CODEWITHSUNDEEP
androidandroid-layout
Carlos
Carlos

Reputation: 355

How to customize EditText?

I need the EditText to look like so:

EditText

I have a color for the bottom line. I did not work with UI for a long time and I don't remember how to do it.

Does anybody know?

Thanks!

Upvotes: 0

Views: 391

Answers (3)

Amir
Amir

Reputation: 16587

Following method works for me ( I found this method by looking at Telegram source code ) :

1-Create selector like following :

   <?xml version="1.0" encoding="utf-8"?>

    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:state_enabled="true" android:state_focused="true" android:drawable="@drawable/search_dark_activated" />
        <item android:state_focused="true" android:drawable="@drawable/search_dark_activated" />
        <item android:drawable="@drawable/search_dark" />
    </selector>

And here is nine patch drawables :

enter image description here enter image description here

Upvotes: 0

Nawako
Nawako

Reputation: 341

In design support library a new element called TextInputLayout was introduced to display the floating label on EditText.

TextInputLayout takes the value of android:hint assigned to EditText and displays it as floating label.

To display it like you want, try this way :

<android.support.design.widget.TextInputLayout
android:id="@+id/input_layout_password"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/yourThemeWithYourColor">

    <EditText
        android:id="@+id/input_email"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Email" />

</android.support.design.widget.TextInputLayout>

Upvotes: 0

Dhaval Patel
Dhaval Patel

Reputation: 10299

You can use below drawable resource as background for EditText:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" /> <!--background color of box-->

        </shape>
    </item>

    <item
        android:top="-2dp"
        android:right="-2dp"
        android:left="-2dp">
        <shape>
            <solid android:color="@android:color/transparent" />
            <stroke
                android:width="1dp"
                android:color="@color/bg_color" />  <!-- color of stroke -->
        </shape>
    </item>
</layer-list>

Upvotes: 2

Related Questions