动态创建不同亮度的颜色

Question

我有一种颜色,我只在运行时知道.使用这种颜色我想创建两种新颜色,一种是非常明亮的颜色,另一种是非颜色的颜色.

所以澄清一下,说我有红色; 我想为"浅红色"颜色和"深红色"颜色创建十六进制值.

我该怎么做呢？我的代码是用Java编写的.

Answer 1

将颜色转换为HSB/HSV(色调 - 饱和度 - 亮度/值)空间,并将亮度调整为较亮,向下调整为较暗.然后再转换回来.在Java中:

    import java.awt.Color;

    float hsbVals[] = Color.RGBtoHSB( originalColour.getRed(),
                                       originalColour.getGreen(),
                                       originalColour.getBlue(), null );
    Color highlight = Color.getHSBColor( hsbVals[0], hsbVals[1], 0.5f * ( 1f + hsbVals[2] ));
    Color shadow = Color.getHSBColor( hsbVals[0], hsbVals[1], 0.5f * hsbVals[2] );

HSB空间专为此类操作而设计.

关键点在于您只需要改变亮度项就可以获得所需的闪电/变暗效果.你必须试验你减轻/变暗的程度.

上面的代码将亮度转换为白色的高亮部分,中间部分转换为黑色的阴影.(我使用此代码在按钮上创建突出显示的边框效果.)

请参阅:http://en.wikipedia.org/wiki/HSL_and_HSV和http://www.acasystems.com/en/color-picker/faq-hsb-hsv-color.htm

编辑:根据评论,该java.awt.Color课程不能在GWT中使用.由于Color我们使用的类的唯一部分是HSV到RGB和RGB到HSV转换,因为您使用GWT,您可以改为google以实现这些算法: Google HSV RGB转换算法.例如:

• javascripter.net
• cs.rit.edu/~ncs
• rapidtables.com(RGB到HSV)
• rapidtables.com(HSV转RGB)
• StackOverflow:将RGB转换为HSV和HSV转换为RGB的算法？

Answer 2

至少有两个不错的解决方案,一个更好(无论如何更适合').这取决于您想要使用的颜色,还是对简短代码的权衡.

使用模拟亮度的色彩空间

问题是您的颜色可能被指定为RGB(即红色,绿色和蓝色的数量,反映您的显示器.)更改颜色亮度的最佳方法是在亮度为一个组件的不同颜色空间中指定颜色,例如HSB - 色调('颜色'),饱和度(颜色的'量')和亮度(我想是不言自明的!)

这对HSL和HSV颜色模型Wikipedia文章解释了远远超过你可能想知道:)

看看这个HSB演示.

关键是,一旦您的颜色在一个组件亮度的不同空间中指定,更改亮度很容易,因为您可以根据需要增加或减少该组件,就像增加或减少蓝色数量一样. RGB颜色.我认为,Java内置了一些颜色转换功能 - 一些谷歌搜索发现这个页面有一个方便的例子,Color.RGBtoHSB()并再次返回Color.HSBtoRGB.

混合白色或黑色

这是更黑的,但在大多数情况下都很有效,而且我编写的大多数代码需要获得两种版本的颜色(例如,对于渐变),对于像UI背景这样不重要的东西使用这种方法.逻辑是,颜色越接近白色(RGB 255,255,255),颜色越亮,越接近黑色(RGB 0,0,0)越暗.因此,为了提亮一些东西,请用25%的白色混合.对于每个通道/组件,您可以通过采用一种颜色的比例和另一种颜色的比例的倒数来混合两种颜色.

以下是未经测试的,是我用来做同样事情的Delphi代码的转换(代码来自内存,最重要的是我多年没有使用Java而且不记得语法和类好吧,所以我不希望这个编译,但你应该能够得到一个想法):

Color Blend(Color clOne, Color clTwo, float fAmount) {
    float fInverse = 1.0 - fAmount;

    // I had to look up getting colour components in java.  Google is good :)
    float afOne[] = new float[3];
    clOne.getColorComponents(afOne);
    float afTwo[] = new float[3]; 
    clTwo.getColorComponents(afTwo);    

    float afResult[] = new float[3];
    afResult[0] = afOne[0] * fAmount + afTwo[0] * fInverse;
    afResult[1] = afOne[1] * fAmount + afTwo[1] * fInverse;
    afResult[2] = afOne[2] * fAmount + afTwo[2] * fInverse;

    return new Color (afResult[0], afResult[1], afResult[2]);
}

你可能会喜欢它:

Color clBrighter = Blend(Color.red, Color.white, 0.25);

您可能需要添加一些安全代码,例如确保每个组件的钳位在0..255之间,或者检查dAmount真正在0..1范围内.

在Java的彩色文档看起来像Color类有各种有用的方法.(编辑:我刚才注意到你说你正在使用的gwt不是awt-我还没有使用它,而且不知道是包括从标准的Java类的东西它应该指向你在正确的方向呢.)这是可能的,这不是最干净Java中的方式 - 这可能是由于我现在对类和方法缺乏了解 - 但它应该足以让你顺利进入轨道.希望有所帮助!

Answer 3

我不知道你有哪种格式的颜色（我试图看看 GWT 是否使用颜色......但它们严重依赖 CSS，所以它们没有特定的属性）。

无论如何，如果每个分量（红色、绿色、蓝色）都有一个值，并且每个值的范围在 0 到 255 之间（这是标​​准的），则应用此算法：

• 对于每个组件
  • 将原始值乘以一个系数（假设为 1.1，亮度增加 10%）
  • 将 float/double 值转换为 int
  • 如果该值超过 255，则将其削减为 255

然后你将得到一个新的颜色（一个新的三分量元组）。

六色

如果您有网页格式的颜色：

RRGGBB

RR - two hexa digits for red
GG - two hexa digits for green
BB - two hexa digits for blue

您需要将它们转换为 int 再转换回 hexa：

十六进制字符串转int

Integer.parseInt("AB", 16"); // returns 171

int 转 十六进制字符串

Integer.toHexaString(171); // returns "AB"