How to apply opacity in Android color

Today I was chatting with my friend Andres Galante about colors in Android. He was about to send some colors for a developer team’s use in an Android app and asked me: Can you use rgba for the greys or they must be hex?

The short answer is:

Yes we can!

You can use the Android Color util method argb:

But… it’s not common. Android developers usually set colors as a resource in XML file and unfortunelly XML resource not accept RGB only HEX

/res/values/color.xml

So, He told me:

The problem is Material Design has specific opacity rules for text, icons, and dividers. How we apply it using HEX?

Well, It’s not a problem, because Android uses Hex ARGB values, which are formatted as #AARRGGBB

The first pair of letters (AA), represent the Alpha. You must convert your decimal opacity values to a Hexdecimal value. Here are the steps:

  1. Take your opacity as a decimal value and multiply it by 255. So, if you have a block that is 50% opaque the decimal value would be .5. For example: .5 x 255 = 127.5
  2. The fraction won’t convert to hex, so you must round your number up or down to the nearest whole number. For example: 127.5 rounds up to 128; 55.25 rounds down to 55.
  3. Enter your decimal value in a decimal to hexadecimal converter, like this http://www.binaryhexconverter.com/decimal-to-hex-converter, and convert your values
  4. If you only get back a single value, prefix it with a zero. For example, if you’re trying to get 5% opacity and your going through this process you’ll end up with the hex value of D. Add a zero in front of it so it appears as 0D.

Source: Alpha Hex Value Process

/res/values/color.xml

… and if you are lazy (like me), I did the math for you

About the author

Daniel Passos

Open source addicted, geek, teacher, traveler, Android and iOS freak. Android Tech Leader at Red Hat and Dj in spare time

By Daniel Passos

Categories

Tags