4

i'm creating background for my EditText , and i want to add line under the text.

My background code:

<item android:state_pressed="true" android:state_focused="true">
    <shape>
        <solid android:color="#10FFFFFF" />
        <corners android:radius="5dp" />
    </shape>
</item>

How can i add line inside the shape?

Preview from graphics project: enter image description here

Lal
  • 14,726
  • 4
  • 45
  • 70
Maciej K
  • 160
  • 4
  • 11
  • The best way is to create an empty rectangle (set solid to transparent and stroke to desired color) and "push" the top, left, and right edges off with negative offsets. See this: http://stackoverflow.com/questions/19238738/android-shape-with-bottom-stroke/19239478#19239478 – Krylez Jul 21 '14 at 16:49
  • You create a 9-patch image and manually draw a line in. Or if you want to do something more programmatically involved, you can create your own `EditText` that draws lines: http://stackoverflow.com/a/6111460/394933 – Brian Jul 21 '14 at 18:14

2 Answers2

17

Try this (the answer is found by editing the post Krylez posted). I have tested this and it works. Create a XML in the drawable folder with, and set the colors as you desire. Then set is as a background for the 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="#000000" />  <!-- color of stroke -->
        </shape>
    </item>
</layer-list>
Ibrahim Yildirim
  • 2,731
  • 2
  • 19
  • 31
1

I've recreated the behavior of original bottom line. It includes paddings on the edges and same behavior when focused.

expression_edit_text_bgc_selector.xml (set it in android:background)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true"
        android:drawable="@drawable/expression_edit_text_bgc_focused"/>
    <item android:drawable="@drawable/expression_edit_text_bgc_normal"/>
</selector>

expression_edit_text_bgc_focused.xml

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

    <!--<item android:drawable="@color/main_bg_color"/>-->
    <item>
        <shape>
            <solid android:color="@android:color/transparent"/>
        </shape>
    </item>

    <item
        android:gravity="bottom"
        android:bottom="8dp"
        android:left="4dp"
        android:right="4dp">
        <shape android:shape="rectangle">
            <size android:height="2dp"/>
            <solid android:color="?colorAccent"/>
        </shape>
    </item>
</layer-list>

expression_edit_text_bgc_normal.xml

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

    <!--<item android:drawable="@color/main_bg_color"/>-->
    <item>
        <shape>
            <solid android:color="@android:color/transparent"/>
        </shape>
    </item>

    <item
        android:gravity="bottom"
        android:bottom="8dp"
        android:left="4dp"
        android:right="4dp">
        <shape android:shape="rectangle">
            <size android:height="1dp"/>
            <solid android:color="?android:colorControlNormal"/>
        </shape>
    </item>
</layer-list>
Ermac
  • 21
  • 4