基于文件加载百分比的 RGB 渐变

Question

我正在开发我的第一个 Flash 项目，对于我的预加载器，我想根据加载的百分比做一个非常简单的渐变。预加载器显示“77% 已加载...”，其中数字 77 是一个称为percentLoaded 的动态文本实例。我希望%Loaded 的textColor 以灰度形式从#000000 渐变到#FFFFFF。

因此，我不能简单地这样做：

percentLoaded.textColor=(currentValue/100)*0xFFFFFF;

这只是将 textColor 转换为 FFFFFF 的倍数，但输出颜色，因为它不是三个单独的组件。目前，这就是我所得到的：

percentLoaded.text=currentValue.toString();
percentLoaded.textColor=rgb2hex((currentValue/100)*255, (currentValue/100)*255, (currentValue/100)*255);

其中“rgb2hex”是在类中定义的函数，如下所示：

public function rgb2hex(r:Number, g:Number, b:Number) {
    return '0x'+(r << 16 | g << 8 | b).toString(16).toUpperCase();
}

但看起来这实际上并没有改变字体的颜色。我已导入 flash.text.TextField 和 flash.display.MovieClip，但不确定是否缺少其他内容。使用字符串连接会更容易吗？或者 currentValue/100 是否发生了一些事情并将其作为数字传递？

如果好奇，我找到了 rgb2hex 的代码

谢谢！

Answer 1

percentLoaded.textColor=(currentValue/100)*0xFFFFFF;

这已经很接近了。

要获得灰度，您确实需要拥有每个组件，但这仍然可以通过您的类似方法来完成：

percentLoaded.textColor = uint((currentValue / 100) * 0xFF) * 0x010101;

Answer 2

你很幸运，我最近在一个项目中碰巧做到了这一点，只是用了不同的颜色。这是一个函数，它将基于 0-1 的范围返回两个其他颜色之间的颜色值。我认为该代码非常不言自明，但如果您遇到任何问题，请告诉我。

private function getBetweenColourByPercent(value:Number = 0.5 /* 0-1 */, highColor:uint = 0xFFFFFF, lowColor:uint = 0x000000):uint {
    var r:uint = highColor >> 16;
    var g:uint = highColor >> 8 & 0xFF;
    var b:uint = highColor & 0xFF;

    r += ((lowColor >> 16) - r) * value;
    g += ((lowColor >> 8 & 0xFF) - g) * value;
    b += ((lowColor & 0xFF) - b) * value;

    return (r << 16 | g << 8 | b);
}

泰勒.

Answer 3

percentLoaded.textColor = int((currentValue / 100) * 0xFF) * 0x010101;

乘以 0x010101 之前必须强制转换为 int。 8 位颜色值只能是 0-255 之间的整数。如果不在这些范围内，乘以 0x010101 可能会导致数字从一个颜色分量（RR、GG、BB）溢出到另一个颜色分量（B->G、G->R）。但如果不是整数（R→G，G→B），它们也可以以其他方式携带。我假设 currentValue 是 0-100 之间的任意数字。

考虑一下，每个数字都有自己的颜色分量（以十进制表示）：

5.0 * 111 = 555 = 5R, 5G, 5B
5.5 * 111 = 610.5 = 6R, 1G, 0.5B

Answer 4

如果这对你有用

percentLoaded.textColor=(currentValue/100)*0xFFFFFF;

那么你可以这样做

var percent = currentValue / 100;
percentLoaded.textColor = Math.floor(percent*0xFF) * 0x010101;