android custom EditText UI

Question

I would like to customize the way the default EditText is drawn on the screen, I have this code:

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

 <item android:state_pressed="true" >
<shape android:shape="rectangle">
    <solid
        android:color="#00ff00" />
    <stroke
        android:width="5dp"
        android:color="#ff0000"
        android:dashWidth="3dp"
        android:dashGap="2dp" />
</shape>
</item>

<item android:state_focused="true" >
<shape>
    <gradient
        android:endColor="#8dc73f"
        android:centerColor="#d4d4d4"
        android:startColor="#d4d4d4"
        android:centerX="0.5"
        android:centerY="0.5"
        android:angle="270" />
    <stroke
        android:width="1dp"
        color="#8dc73f" />
    <corners
        android:radius="6dp" />
    <padding
        android:left="10dp"
        android:top="10dp"
        android:right="10dp"
        android:bottom="10dp" />
</shape>
</item>
 <item>        
 <shape>
     <gradient
        android:endColor="#d4d4d4"
        android:centerColor="#d4d4d4"
        android:startColor="#d4d4d4"
        android:angle="270" />
     <stroke
        android:width="1dp"
        color="#00ff00" />
     <corners
        android:radius="7dp" />
   </shape>
   </item>
  </selector>

which works fine but the problem is that on the focused state I would like to apply the effect round of the EditText and note inside, like the default android effect is applied. Is this possible and how? I haven't found a solution, the above code only applies the effect inside the EditText.

Answer 1

You can customize the way the default EditText is drawn by creating an XML file in the 'Drawable' folder and mentioning in code how you want it to look. Sample given below:

<selector><item android:state_pressed="true">
    <shape android:shape="rectangle">
        <gradient android:startColor="#40FFE600"
            android:centerColor="#60FFE600" android:endColor="#90FFE600"
            android:angle="270" android:centerX="0.5" android:centerY="0.5" />
        <stroke android:width="5dp" android:color="#50FF00DE" />
        <corners android:radius="7dp" />
        <padding android:left="10dp" android:top="6dp" android:right="10dp"
            android:bottom="6dp" />
    </shape>
</item>
<item android:state_focused="true">
    <shape>
        <gradient android:startColor="#40CB1759"
            android:centerColor="#60CB1759" android:endColor="#90CB1759"
            android:angle="270" android:centerX="0.5" android:centerY="0.5" />
        <stroke android:width="5dp" android:color="#50ff0000" />
        <corners android:radius="7dp" />
        <padding android:left="10dp" android:top="6dp" android:right="10dp"
            android:bottom="6dp" />
    </shape>
</item>
<item>
    <shape>
        <gradient android:startColor="#402168D2"
            android:centerColor="#602168D2" android:endColor="#902168D2"
            android:angle="270" android:centerX="0.5" android:centerY="0.5" />
        <stroke android:width="5dp" android:color="#50ff0000" />
        <corners android:radius="7dp" />
        <padding android:left="10dp" android:top="6dp" android:right="10dp"
            android:bottom="6dp" />
    </shape>
</item></selector>