Take the 2-minute tour ×

I'm trying to figure out how to make a custom EditText that has black borders along it's right and left sides, a green border on top, and a blue border on the bottom. See below: enter image description here

I'm fairly new to Android development and I've spent quite a lot of time reading their documentation but haven't had any luck finding anything on this kind of customization. I know in CSS you can just use the border-right, border-left, etc... properties but not sure if it's that straightforward in Android development. I'm looking for the solution that is the most compatible, preferably from version 2.3 (Gingerbread).

share|improve this question
add comment

2 Answers

You'll have to make a custom image to use as the background. It's relatively straight forward, you'll want to use a 9-patch as described in the 2D graphics guide.

Once you have that, you'll put it in your res/drawable folder of your project, and then use it with the EditText in XML as

share|improve this answer
I tend to stay away from image solutions like this because I'm afraid of the quality of the image being distorted depending on how big or how small it needs to be stretched, as well as handling for retina. –  paul smith Dec 5 '12 at 20:33
A 9patch has its stretchable zones specifically marked by you, so provided you do it correctly, there won't be any distortion. For a simple border like you want, there won't be any distortion at all, even if you plastered it on a display 100 feet wide 360,000 pixels long. –  Ralgha Dec 5 '12 at 20:40
add comment

create a LayerList with a square colored in the wanted gradient, and above it a white square with some borders. then use this drawable as your TextView background.

share|improve this answer
Could you give me a code sample? Your explanation sounds very confusing to me. –  paul smith Dec 5 '12 at 20:31
add comment

Your Answer


