【问题标题】:Hex transparency in colors [duplicate]颜色的十六进制透明度[重复]
【发布时间】:2013-03-28 22:37:10
【问题描述】:

我正在为我的应用小部件实现小部件透明度选项,尽管我在正确设置十六进制颜色值时遇到了一些问题。作为十六进制颜色透明度的新手,我搜索了一下,虽然我找不到我的问题的具体答案。

我想通过十六进制颜色设置透明度,所以假设我的十六进制颜色 ID“#33b5e5”,我希望它是 50% 透明的。然后我将使用“#8033b5e5”,因为 80 是 50%。

我在这里找到了一个有用的图表:http://www.dtp-aus.com/hexadeci.htm。有了这些数据,我想出了这个:

0% = #00
10% = #16
20% = #32
30% = #48
40% = #64
50% = #80
60% = #96
70% = #112
80% = #128
90% = #144

现在,当我的十六进制数超过 100 时,问题开始出现。十六进制颜色代码只能是 8 个符号,对吗?例如 #11233b5e5 (80%) 崩溃。

我可以做些什么来让我也使用更高的数字?

【问题讨论】:

标签: android colors hex transparency


【解决方案1】:

这是不透明度的十六进制值的正确百分比表。例如。对于 50% 白色,您将使用 #80FFFFFF。要考虑透明度,请颠倒百分比的顺序(更不透明 = 更不透明)。

% Hex
100% FF
95% F2
90% E6
85% D9
80% CC
75% BF
70% B3
65% A6
60% 99
55% 8C
50% 80
45% 73
40% 66
35% 59
30% 4D
25% 40
20% 33
15% 26
10% 1A
5% 0D
0% 00

(source question)

【讨论】:

【解决方案2】:

简答

您可以在https://play.golang.org/p/l1JaPYFzDkI 的这个操场上查看完整的百分比表并运行代码。

伪代码的简短说明

十六进制值的百分比

  1. 十进制 = 百分比 * 255 / 100 。例如:十进制 = 50*255/100 = 127.5
  2. 十进制转换为十六进制值。例如:十进制的 127.5 = 7*16^1 + 15 = 十六进制的 7F

十六进制值到百分比

  1. 将十六进制值转换为十进制。例如:D6 = 13*16^1 + 6 = 214
  2. 百分比 =(十进制值)* 100 / 255。例如:214 *100/255 = 84%

More infos for the conversion decimal <=> hexadecimal

长答案:如何在脑海中计算

这个问题可以通过cross multiplication 来解决。

我们有一个百分比(范围从 0 到 100 )和另一个数字(范围从 0 到 255)然后转换为十六进制。

  • 100 255(FF 十六进制)
  • 0 0(十六进制的 00)

1%

  • 1 * 255 / 100 = 2,5
  • 如果向下取整,则十六进制的 2,5 是 2

2%

  • 2 * 255 / 100 = 5
  • 六进制中的 5 是 5

最佳答案中的表格给出了 5% 的百分比。

如何计算你脑海中的数字?由于2.5增量,第一个加2,下一个加3

  • 95% — F2 // 开始
  • 96% — F4 // F2 加 2
  • 97% — F7 // 添加 3 。或 F2 + 5 = F7
  • 98% — F9 // 加 2
  • 99% — FC // 十六进制加 3. 9 + 3 = 12 : C
  • 100% — FF // 加 2

我更喜欢教如何找到解决方案,而不是展示一个你不知道结果来自哪里的答案表。

给一个人一条鱼,你可以喂他一天;教人钓鱼和 你养他一辈子

【讨论】:

    【解决方案3】:

    颜色十六进制表示法如下:#AARRGGBB

    • A:阿尔法
    • R:红色
    • G:绿色
    • B:蓝色

    您应该首先了解hexadecimal 的工作原理。你最多可以写FF。

    【讨论】:

    • 确保验证您的系统使用的是 ARGB 还是 RGBA(或其他)。可以防止您对一些相当简单且可能晦涩难懂的事情摸不着头脑并感到困惑。
    【解决方案4】:

    该图表未显示百分比。 “#90”不是“90%”。 该图表显示了十六进制到十进制的转换。十六进制数 90(通常表示为 0x90)等价于十进制数 144。

    十六进制数以 16 为基数,因此每个数字都是介于 0 和 F 之间的值。两字节十六进制值(例如颜色的透明度)的最大值为 0xFF,或十进制的 255。因此 100% 是 0xFF。

    【讨论】:

    • 如果不是十六进制到十进制转换的问题,那么测量透明度的正确方法是什么? 0xFF 仍然多于两个数字。是否有某种我不知道的系统正确图表?
    • 十六进制到十进制的问题。问题是您不能只取十进制数并将其称为百分比(例如,十进制的 50 不是百分比)。由于您可以用十六进制表示的最大十进制值为 255,因此 0x7F(十进制 127)的值约为 50%。十进制数 50 (0x32) 仅占 20% 左右。
    • 至于 0xFF 超过 2 位数字 - “0x”只是一个符号方便,因此您不必在每次写出数字时都指定“十六进制数...”。在您的 XML 中,您仍然会忽略它。因此,根据上面提到的#AARRGGBB 方案@erkangur,50% 透明的黑色背景将作为“#7F000000”写入 color.xml 文件中。
    【解决方案5】:

    我为一个安卓应用构建了这个小助手方法,可能会派上用场:

     /**
     * @param originalColor color, without alpha
     * @param alpha         from 0.0 to 1.0
     * @return
     */
    public static String addAlpha(String originalColor, double alpha) {
        long alphaFixed = Math.round(alpha * 255);
        String alphaHex = Long.toHexString(alphaFixed);
        if (alphaHex.length() == 1) {
            alphaHex = "0" + alphaHex;
        }
        originalColor = originalColor.replace("#", "#" + alphaHex);
    
    
        return originalColor;
    }
    

    【讨论】:

      【解决方案6】:

      这可能是很晚的答案。但是这张图表杀死了它。

      所有百分比值都映射到十六进制值。

      https://web.archive.org/web/20200812155307/http://online.sfsu.edu/chrism/hexval.html

      【讨论】:

      • 链接过期,无法加载
      • @Haroon 感谢您的指出。现在更新了网址。
      【解决方案7】:

      在谷歌搜索(或click here)上试试这个

      255 * .2 to hex

      它会因此生成0x33

      但是,Google 不会对值进行四舍五入,因此您只能使用 1 位乘数。如果你想使用 .85,你必须先得到 255 * .85 的四舍五入值,然后在谷歌搜索中输入 (rounded-value here) to hex

      【讨论】:

        【解决方案8】:

        用python计算这个,例如(用python 3写的),50%的透明度:

        hex(round(256*0.50))
        

        :)

        【讨论】:

          【解决方案9】:

          我意识到这是一个老问题,但我在做类似的事情时遇到了这个问题。

          使用 SASS,您有一种非常优雅的方式将 RGBA 转换为十六进制 ARGB:ie-hex-str。我在这里的mixin中使用了它。

          @mixin ie8-rgba ($r, $g, $b, $a){
              $rgba: rgba($r, $g, $b, $a);
              $ie8-rgba: ie-hex-str($rgba);
              .lt-ie9 &{
                background-color: transparent;
                filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#{$ie8-rgba}', endColorstr='#{$ie8-rgba}');
            }
          }
          
          .transparent{
              @include ie8-rgba(88,153,131,.8);
              background-color: rgba(88,153,131,.8);
          }
          

          输出:

          .transparent {
            background-color: rgba(88, 153, 131, 0.8);
          }
          .lt-ie9 .transparent {
            background-color: transparent;
            filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#CC589983', endColorstr='#CC589983');
            zoom: 1;
          }

          【讨论】:

          • 问题有安卓标签。
          【解决方案10】:

          我总是来这里检查 int/hex alpha 值。因此,最终在我的 java utils 类中创建了一个简单的方法。此方法会将百分比转换为十六进制值并附加到颜色代码字符串值。

           public static String setColorAlpha(int percentage, String colorCode){
              double decValue = ((double)percentage / 100) * 255;
              String rawHexColor = colorCode.replace("#","");
              StringBuilder str = new StringBuilder(rawHexColor);
          
              if(Integer.toHexString((int)decValue).length() == 1)
                  str.insert(0, "#0" + Integer.toHexString((int)decValue));
              else
                  str.insert(0, "#" + Integer.toHexString((int)decValue));
              return str.toString();
          }
          

          所以,Utils.setColorAlpha(30, "#000000") 会给你#4c000000

          【讨论】:

            猜你喜欢
            • 2021-10-06
            • 2020-12-25
            • 2014-09-22
            • 2020-08-12
            • 2013-10-01
            • 2010-12-17
            • 2020-12-25
            • 2021-12-09
            相关资源
            最近更新 更多