Click here to Skip to main content
15,896,552 members
Articles / Mobile Apps / Android
Tip/Trick

How to make EditText With Border and Gradient Background in Android Using XML

Rate me:
Please Sign up or sign in to vote.
4.60/5 (13 votes)
24 Nov 2014CPOL 225.9K   12   4
Here, I am going to apply a good look and feel on EditText in Android. For this purpose, we can use image also but I'll use XML here.

Introduction

Actually, there are lots of links you can find to design view using XML in Android, but here I am going to give a good look and feel.

EditText view with border and gradient background

Using the Code

Create an XML file with the name "EditTextStyle.xml" in the drawable folder in your project and write the following code:

XML
<?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="3dp"
         android:color="#4799E8"/>
  <corners android:radius="5dp" />
  <gradient
   android:startColor="#C8C8C8"
   android:endColor="#FFFFFF"
   android:type="linear"
   android:angle="270"/>
</shape>

Now add the following attribute to your EditText:

XML
<EditText
            android:id="@+id/inputSearchEditText"
            android:layout_marginLeft="15dp"
            android:layout_marginTop="15dp"
            android:layout_marginBottom="20dp"
            android:layout_marginRight="15dp"
            android:layout_centerVertical="true"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:ellipsize="start"
            android:gravity="center"
            android:hint="Search text"
            android:inputType="text"
            android:background="@drawable/EditTextStyle"/>

Or you can apply the style by using C# code if you are using Xamarin to develop Android app:

C#
inputSearchEditText.SetBackgroundResource(Resource.Drawable.EditTextStyle);

Now it's finished. Actually, it's very simple.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Student ORIENTAL INSTITUTE OF SCIENCE AND TECHNOLOGY, RGPV
India India
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
QuestionError Occurring Pin
Member 125889568-Aug-16 20:27
Member 125889568-Aug-16 20:27 
GeneralBest way to border in android. Pin
harshadcse2-Jan-15 9:20
harshadcse2-Jan-15 9:20 
refer this link: http://angrytools.com/android/button/[^]

Android Button Maker is online tool to generate buttons code for Android Apps. Android API provide Drawable Resources where XML file defines geometric shape, including colors, border and gradients.
These button is generating based on shape drawable XML code which load faster compare to normal png buttons. You can customize button properties in setting panel and get source code.

Thanks,
Harshad
QuestionThank you Pin
Mohammedkabir Dawud23-Dec-14 5:53
professionalMohammedkabir Dawud23-Dec-14 5:53 
GeneralMy vote of 1 Pin
FaizanMubasher26-Nov-14 0:38
professionalFaizanMubasher26-Nov-14 0:38 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.