Android ARGB 颜色透明度对照表
1. 背景
在 Android 开发中，颜色由 ARGB（Alpha、Red、Green、Blue）四个通道组成，其中 Alpha（透明度） 控制颜色的透明程度：
- 0x00 = 完全透明
- 0xFF = 完全不透明
透明度在 UI 渲染、过渡动画、遮罩层、Compose 组件绘制 等场景中使用广泛。
2. 颜色格式表示
2.1 ARGB 十六进制表示
Android 常用 #AARRGGBB 格式定义颜色：
- AA = Alpha 通道（透明度）
- RR = 红色通道
- GG = 绿色通道
- BB = 蓝色通道
示例：
<!-- 完全不透明的红色 -->
#FFFF0000
<!-- 半透明红色 (50%) -->
#80FF0000
<!-- 完全透明 (无颜色) -->
#00FFFFFF
⚠️ 注意：如果省略透明度，Android 默认透明度为 FF（完全不透明），即 #RRGGBB 等价于 #FFRRGGBB。
2.2 使用 Color.argb()
通过代码动态设置颜色：
val red50 = Color.argb(128, 255, 0, 0) // 半透明红色 (Alpha=128)
参数说明：
- 第一个参数：alpha，范围 0~255
- 其余三个：red, green, blue，范围同样是 0~255
2.3 使用 ColorUtils.setAlphaComponent()
如果已经有颜色值，可以单独修改透明度：
import androidx.core.graphics.ColorUtils
val baseColor = Color.RED
val newColor = ColorUtils.setAlphaComponent(baseColor, 128) // 设置为 50% 透明
3. 在 View 系统中的透明度
3.1 背景半透明
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#80000000" /> <!-- 半透明黑色遮罩 -->
3.2 文字透明度
textView.setTextColor(Color.argb(128, 255, 255, 255)) // 半透明白色
3.3 图片透明度
imageView.imageAlpha = 128 // 0-255
3.4 View 整体透明度
view.alpha = 0.5f // 范围 0.0f ~ 1.0f
📌 区别：
- setTextColor(Color.argb()) → 改变文字本身颜色透明度
- view.alpha → 改变整个 View（包含子控件）的透明度
4. 在 Jetpack Compose 中的透明度
4.1 使用 Color.copy(alpha = …)
Box(
modifier = Modifier
.size(100.dp)
.background(Color.Red.copy(alpha = 0.5f)) // 50% 透明
)
4.2 使用 Modifier.alpha()
Text(
text = "半透明文字",
modifier = Modifier.alpha(0.3f), // 30% 透明
color = Color.White
)
4.3 使用 graphicsLayer
Image(
painter = painterResource(id = R.drawable.avatar),
contentDescription = null,
modifier = Modifier.graphicsLayer(alpha = 0.7f) // 70% 透明
)
4.4 动画透明度
val alpha by animateFloatAsState(targetValue = 0.5f)
Box(
modifier = Modifier
.size(120.dp)
.graphicsLayer(alpha = alpha)
.background(Color.Blue)
)
5. 常见透明度值速查表
| 透明度百分比 | 十进制值 | 十六进制值 |
|---|---|---|
| 0% [完全透明] | 0 | 00 |
| 1% | 3 | 03 |
| 2% | 5 | 05 |
| 3% | 8 | 08 |
| 4% | 10 | 0A |
| 5% | 13 | 0D |
| 6% | 15 | 0F |
| 7% | 18 | 12 |
| 8% | 20 | 14 |
| 9% | 23 | 17 |
| 10% | 26 | 1A |
| 11% | 28 | 1C |
| 12% | 31 | 1F |
| 13% | 33 | 21 |
| 14% | 36 | 24 |
| 15% | 38 | 26 |
| 16% | 41 | 29 |
| 17% | 43 | 2B |
| 18% | 46 | 2E |
| 19% | 48 | 30 |
| 20% | 51 | 33 |
| 21% | 54 | 36 |
| 22% | 56 | 38 |
| 23% | 59 | 3B |
| 24% | 61 | 3D |
| 25% | 64 | 40 |
| 26% | 66 | 42 |
| 27% | 69 | 45 |
| 28% | 71 | 47 |
| 29% | 74 | 4A |
| 30% | 76 | 4C |
| 31% | 79 | 4F |
| 32% | 82 | 52 |
| 33% | 84 | 54 |
| 34% | 87 | 57 |
| 35% | 89 | 59 |
| 36% | 92 | 5C |
| 37% | 94 | 5E |
| 38% | 97 | 61 |
| 39% | 99 | 63 |
| 40% | 102 | 66 |
| 41% | 105 | 69 |
| 42% | 107 | 6B |
| 43% | 110 | 6E |
| 44% | 112 | 70 |
| 45% | 115 | 73 |
| 46% | 117 | 75 |
| 47% | 120 | 78 |
| 48% | 122 | 7A |
| 49% | 125 | 7D |
| 50% | 128 | 80 |
| 51% | 130 | 82 |
| 52% | 133 | 85 |
| 53% | 135 | 87 |
| 54% | 138 | 8A |
| 55% | 140 | 8C |
| 56% | 143 | 8F |
| 57% | 145 | 91 |
| 58% | 148 | 94 |
| 59% | 150 | 96 |
| 60% | 153 | 99 |
| 61% | 156 | 9C |
| 62% | 158 | 9E |
| 63% | 161 | A1 |
| 64% | 163 | A3 |
| 65% | 166 | A6 |
| 66% | 168 | A8 |
| 67% | 171 | AB |
| 68% | 173 | AD |
| 69% | 176 | B0 |
| 70% | 178 | B2 |
| 71% | 181 | B5 |
| 72% | 184 | B8 |
| 73% | 186 | BA |
| 74% | 189 | BD |
| 75% | 191 | BF |
| 76% | 194 | C2 |
| 77% | 196 | C4 |
| 78% | 199 | C7 |
| 79% | 201 | C9 |
| 80% | 204 | CC |
| 81% | 207 | CF |
| 82% | 209 | D1 |
| 83% | 212 | D4 |
| 84% | 214 | D6 |
| 85% | 217 | D9 |
| 86% | 219 | DB |
| 87% | 222 | DE |
| 88% | 224 | E0 |
| 89% | 227 | E3 |
| 90% | 230 | E6 |
| 91% | 232 | E8 |
| 92% | 235 | EB |
| 93% | 237 | ED |
| 94% | 240 | F0 |
| 95% | 242 | F2 |
| 96% | 245 | F5 |
| 97% | 247 | F7 |
| 98% | 250 | FA |
| 99% | 252 | FC |
| 100% [完全不透明] | 255 | FF |
6. 注意事项
- 1）性能问题：过度使用半透明层可能导致绘制开销增大，尤其在低端设备上。
- 2）叠加效果：多个透明层叠加时，透明度会叠加计算，可能出现预期外的效果。
- 3）硬件加速：部分透明渲染在关闭硬件加速时可能性能较差。
- 4）Material Design 建议：推荐使用半透明黑（如 #80000000）或白（如 #80FFFFFF）作为遮罩色，保证统一的 UI 效果。
7. 总结
- View 系统与 Compose 都支持透明度设置。
- 透明度可通过 alpha 通道 或 Modifier.alpha() 实现。
- 透明度速查表可帮助快速选择合适的透明值。
