I am trying to understand how colors work in Android. I have this color set as the background of my LinearLayout, and I get a background gray with some transparency:
<gradient android:startColor="#b4555555" android:endColor="#b4555555"
android:angle="270.0" />
If I remove the last two characters (55) I get a solid color, losing the transparency. I was trying to find a page where I can see some explanation about this, but I couldn't find it.
If you provide 6 hex digits, that means RGB (2 hex digits for each value of red, green and blue).
If you provide 8 hex digits, it's an ARGB (2 hex digits for each value of alpha, red, green and blue respectively).
So by removing the final 55 you're changing from A=B4, R=55, G=55, B=55 (a mostly transparent grey), to R=B4, G=55, B=55 (a fully-non-transparent dusky pinky).
See the "Color" documentation for the supported formats.
Android uses hexadecimal ARGB values, which are formatted as #AARRGGBB. That first pair of letters, the AA, represent the alpha channel. You must convert your decimal opacity values to a hexadecimal value. Here are the steps:
Alpha Hex Value Process
That's how you find the alpha channel value. I've taken the liberty to put together a list of values for you. Enjoy!
Hex Opacity Values
Going off the answer from @BlondeFurious, here is some Java code to get each hexadecimal value from 100% to 0% alpha:
for (double i = 1; i >= 0; i -= 0.01) {
i = Math.round(i * 100) / 100.0d;
int alpha = (int) Math.round(i * 255);
String hex = Integer.toHexString(alpha).toUpperCase();
if (hex.length() == 1)
hex = "0" + hex;
int percent = (int) (i * 100);
System.out.println(String.format("%d%% — %s", percent, hex));
}
Output:
100% — FF
99% — FC
98% — FA
97% — F7
96% — F5
95% — F2
94% — F0
93% — ED
92% — EB
91% — E8
90% — E6
89% — E3
88% — E0
87% — DE
86% — DB
85% — D9
84% — D6
83% — D4
82% — D1
81% — CF
80% — CC
79% — C9
78% — C7
77% — C4
76% — C2
75% — BF
74% — BD
73% — BA
72% — B8
71% — B5
70% — B3
69% — B0
68% — AD
67% — AB
66% — A8
65% — A6
64% — A3
63% — A1
62% — 9E
61% — 9C
60% — 99
59% — 96
58% — 94
57% — 91
56% — 8F
55% — 8C
54% — 8A
53% — 87
52% — 85
51% — 82
50% — 80
49% — 7D
48% — 7A
47% — 78
46% — 75
45% — 73
44% — 70
43% — 6E
42% — 6B
41% — 69
40% — 66
39% — 63
38% — 61
37% — 5E
36% — 5C
35% — 59
34% — 57
33% — 54
32% — 52
31% — 4F
30% — 4D
29% — 4A
28% — 47
27% — 45
26% — 42
25% — 40
24% — 3D
23% — 3B
22% — 38
21% — 36
20% — 33
19% — 30
18% — 2E
17% — 2B
16% — 29
15% — 26
14% — 24
13% — 21
12% — 1F
11% — 1C
10% — 1A
9% — 17
8% — 14
7% — 12
6% — 0F
5% — 0D
4% — 0A
3% — 08
2% — 05
1% — 03
0% — 00
A JavaScript version is below:
var text = document.getElementById('text');
for (var i = 1; i >= 0; i -= 0.01) {
i = Math.round(i * 100) / 100;
var alpha = Math.round(i * 255);
var hex = (alpha + 0x10000).toString(16).substr(-2).toUpperCase();
var perc = Math.round(i * 100);
text.innerHTML += perc + "% — " + hex + " (" + alpha + ")</br>";
}<div id="text"></div>You can also just Google "number to hex" where 'number' is any value between 0 and 255.
These are the conversions for setting the text color opacity levels.
DE0000008A000000610000001F000000
FFFFFFFFB3FFFFFF80FFFFFF1FFFFFFFOn Android, colors are can be specified as RGB or ARGB.
http://en.wikipedia.org/wiki/ARGB
In RGB you have two characters for every color (red, green, blue), and in ARGB you have two additional chars for the alpha channel.
So, if you have 8 characters, it's ARGB, with the first two characters specifying the alpha channel. If you remove the leading two characters it's only RGB (solid colors, no alpha/transparency). If you want to specify a color in your Java source code, you have to use:
int Color.argb (int alpha, int red, int green, int blue)
alpha Alpha component [0..255] of the color
red Red component [0..255] of the color
green Green component [0..255] of the color
blue Blue component [0..255] of the color
Reference: argb
An 8-digit hex color value is a representation of ARGB (Alpha, Red, Green, Blue), whereas a 6-digit value just assumes 100% opacity (fully opaque) and defines just the RGB values. So to make this be fully opaque, you can either use #FF555555, or just #555555. Each 2-digit hex value is one byte, representing values from 0-255.
On Android the color can be declared in the following format
#AARRGGBB
AA - is the bit that’s of most interest to us, it stands for alpha channel
RR GG BB - red, green & blue channels respectively
Now in order to add transparency to our color we need to prepend it with hexadecimal value representing the alpha (transparency).
For example if you want to set 80% transparency value to black color (#000000) you need to prepend it with CC, as a result we end up with the following color resource #CC000000.
You can read about it in more detail on my blog https://androidexplained.github.io/android/ui/2020/10/12/hex-color-code-transparency.html
A color in hexadecimal code is written as
# AA RR GG BB
# Alpha Red Green Blue
And for each group (AA,RR,GG,BB) possible values are :
-> 00 to FF in Hex , i.e. 0 to 255 in decimal
So to change the Alpha/AA/Transparency of the color, you just have to change first two Hexadecimal Characters in the Hex String which is represented by the AA group
For 50% ->
255 x 0.50= 128 (approx/rounded)
And convert
128 to Hex
= 08
So Green #00FF00 with 50% Alpha/Transparency will be #0800FF00
Use this table (i prefer to put it in colors.xml for fast search)
<!--Percent to hex conversion table-->
<!--% 0 1 2 3 4 5 6 7 8 9-->
<!--0 00 03 05 08 0A 0D 0F 12 14 17-->
<!--1 19 1C 1F 21 24 26 29 2B 2E 30-->
<!--2 33 36 38 3B 3D 40 42 45 47 4A-->
<!--3 4D 4F 52 54 57 59 5C 5E 61 63-->
<!--4 66 69 6B 6E 70 73 75 78 7A 7D-->
<!--5 80 82 85 87 8A 8C 8F 91 94 96-->
<!--6 99 9C 9E A1 A3 A6 A8 AB AD B0-->
<!--7 B3 B5 B8 BA BD BF C2 C4 C7 C9-->
<!--8 CC CF D1 D4 D6 D9 DB DE E0 E3-->
<!--9 E6 E8 EB ED F0 F2 F5 F7 FA FC-->
