Android EditText focus border color

When you work with EditText in Android, you might want to change its border color when it is focused or when the focus is lost. In this tip, I am going to show you how to achieve this goal in the following steps.

1. Create a new Android project. Then modify the activity_main.xml file to add tow EditText as shown below.

<LinearLayout xmlns:android=" http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:paddingBottom=" @dimen/activity_vertical_margin"
   android:paddingLeft=" @dimen/activity_horizontal_margin"
   android:paddingRight=" @dimen/activity_horizontal_margin"
   android:paddingTop=" @dimen/activity_vertical_margin"
   tools:context=".MainActivity"
   android:orientation="vertical"
   >
  
   <EditText
          
     android:id="@+id/txt_view"
     android:layout_width="fill_parent"
     android:layout_height="50dp"
     android:hint="Make a focus here"
     />
   <EditText
          
     android:id="@+id/txt_view1"
     android:layout_width="fill_parent"
     android:layout_height="50dp"
     android:hint="Make a focus here"
     />
  
</LinearLayout>





2. You will create one resource xml file in the res/drawable folder. One xml file called focus_border_style.xml. In this file, you need define a shape and its attributes as below. This shape is used as the border style of the first EditText when it is focused. The border color (#00cc33) of the EditText is specified in the stroke tag.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android=" http://schemas.android.com/apk/res/android" android:thickness="0dp" android:shape="rectangle">

<stroke android:width="2dp"
       android:color="#00cc33"/>

<corners android:radius="10dp"    
     />

<padding android:left="10dp"
       android:top="5dp"   
       android:right="10dp"
       android:bottom="5dp"/>

</shape>


3. Create another resource xml (lost_focus_style.xml) as shown below. It is used to apply border color to the EditText when the focus is lost. You will use the setOnFocusChangeListener method to accomplish the task.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android=" http://schemas.android.com/apk/res/android" android:thickness="0dp" android:shape="rectangle">

<stroke android:width="2dp"
       android:color="#000000"/>

<corners android:radius="10dp"    
     />

<padding android:left="10dp"
       android:top="5dp"   
       android:right="10dp"
       android:bottom="5dp"/>

</shape>


4. In the onStart method of the MainActivity class, you write code to apply the border color to the EditText when it is focused and when the focus is lost.

  public void onStart(){
   super.onStart();
   TextView tv=(TextView)findViewById(R.id.txt_view);
   tv.setOnFocusChangeListener( new OnFocusChangeListener(){
  
   public void onFocusChange( View view, boolean hasfocus){
      if(hasfocus){

         view.setBackgroundResource( R.drawable.border_style);
         }
      else{
         view.setBackgroundResource( R.drawable.lost_border_style);
         }
      }
   });
  
   }

Android-EditText-focus-border-color

Posted by: Dara | post date: 06-18-2014 | Subject: Android Apps Development

write programming tip



This website intents to provide free and high quality tutorials, examples, exercises and solutions, questions and answers of programming and scripting languages:
C, C++, C#, Java, VB.NET, Python, VBA,PHP & Mysql, SQL, JSP, ASP.NET,HTML, CSS, JQuery, JavaScript and other applications such as MS Excel, MS Access, and MS Word. However, we don't guarantee all things of the web are accurate. If you find any error, please report it then we will take actions to correct it as soon as possible.