As a software development engineer who works on numerous WaPo Labs products, including Trove, DC Rider, and the recently launched PostTV, I rely on the Android platform to provide quality applications for our users. I’ve learned a lot about Android through my work, from enhancing user interface components to improving application performance, and will be contributing a series about the platform for Labs blog readers, in a feature called “Android Tips.”
In this first post, I’m focusing on the process of customizing an EditText view. This customization is important because the standard EditText view in Android is fairly plain. It comes with a default orange border on most versions which doesn’t necessarily complement every UI design:
For our newest Android app, PostTV, we wanted something a bit jazzier that would work with the general theme of the application.
Here’s how we achieved the look:
Notice that we placed an ImageButton and an EditText field together in a RelativeLayout. By doing this, we made it appear as if the black search icon was a natural part of the EditText element. Next, we used a custom drawable for the background of the EditText element to achieve the black background with the light blue border.
The Results:
Want to learn more tips and tricks about Android? Stay tuned for the next post in the series, which will focus on the interactions between Android Fragments and Activities.