Lovely Gradient Buttons… in Android


I wrote an iPhone post and hinted that I had an Android implementation, and I do!
You can download the project here: unicorn.zip

Normal

Highlighted

So you want lovely gradient buttons, and when you press them, you want another gradient layer to show.

  1. Define your layout in xml, add a button

The Background XML File

This file contains 3 states- default, pressed, and focused. We mainly change default and pressed. The colors are the “high” (on the top, lighter shade) and the “low”, the bottom or darker shade. The angle is the gradient degree. Note the stroke color, which is the border color, and gives the button a nice polish. Also, the rounded corners are done here. We keep it consistent with the iPhone at 7dip.























The Button Style file

Here we put most of our styles for our buttons. Things to note- the slight shadow on the text makes it seemed a bit engraved.



We put these colors in a large Google Doc grid, to keep the hash and digital values straight from app to app.

You can download the project here: unicorn.zip