С#:Создайте более светлый/темный цвет на основе системного цвета.
Вопрос
Дублировать
Как настроить яркость цвета?
Как определить более темный или светлый вариант данного цвета?
Программное осветление цвета
Скажи, что у меня есть
var c = Color.Red;
Теперь я хочу создать новый Color
который светлее или темнее этого цвета.Как я могу сделать это без особых хлопот?
Решение
КонтролПейнт.Светлый .Темный .Темный и т. д.
Color lightRed = ControlPaint.Light( Color.Red );
Другие советы
Я недавно написал об этом в блоге.Основная идея заключается в применении заданного поправочного коэффициента к каждому компоненту цвета.Следующий статический метод изменяет яркость данного цвета с указанным поправочным коэффициентом и создает более темный или более светлый вариант этого цвета:
/// <summary>
/// Creates color with corrected brightness.
/// </summary>
/// <param name="color">Color to correct.</param>
/// <param name="correctionFactor">The brightness correction factor. Must be between -1 and 1.
/// Negative values produce darker colors.</param>
/// <returns>
/// Corrected <see cref="Color"/> structure.
/// </returns>
public static Color ChangeColorBrightness(Color color, float correctionFactor)
{
float red = (float)color.R;
float green = (float)color.G;
float blue = (float)color.B;
if (correctionFactor < 0)
{
correctionFactor = 1 + correctionFactor;
red *= correctionFactor;
green *= correctionFactor;
blue *= correctionFactor;
}
else
{
red = (255 - red) * correctionFactor + red;
green = (255 - green) * correctionFactor + green;
blue = (255 - blue) * correctionFactor + blue;
}
return Color.FromArgb(color.A, (int)red, (int)green, (int)blue);
}
Вы также можете сделать это с помощью Lerp
функция.В XNA есть такой вариант, но его легко написать самому.
Видеть мой ответ на аналогичный вопрос для реализации C#.
Функция позволяет вам сделать это:
// make red 50% lighter:
Color.Red.Lerp( Color.White, 0.5 );
// make red 75% darker:
Color.Red.Lerp( Color.Black, 0.75 );
// make white 10% bluer:
Color.White.Lerp( Color.Blue, 0.1 );
Большинство из этих методов затемняют цвет, но они слишком сильно корректируют оттенок, поэтому результат выглядит не очень хорошо.Лучший ответ - использовать HSLColor Рича Ньюмана класс и отрегулируйте яркость.
public Color Darken(Color color, double darkenAmount) {
HSLColor hslColor = new HSLColor(color);
hslColor.Luminosity *= darkenAmount; // 0 to 1
return hslColor;
}
Вот код JavaScript, который я использую для осветления/затемнения заданного цвета.Вы можете использовать его как основу для эквивалентной функции C#.
Он работает путем расчета расстояния от чистого белого цвета каждого из компонентов RGB, а затем корректирует это расстояние с помощью предоставленного коэффициента.Новое расстояние используется для расчета нового цвета.Коэффициент от 0 до 1 темнеет, коэффициент выше 1 – светлее.
function Darken( hexColor, factor )
{
if ( factor < 0 ) factor = 0;
var c = hexColor;
if ( c.substr(0,1) == "#" )
{
c = c.substring(1);
}
if ( c.length == 3 || c.length == 6 )
{
var i = c.length / 3;
var f; // the relative distance from white
var r = parseInt( c.substr(0, i ), 16 );
f = ( factor * r / (256-r) );
r = Math.floor((256 * f) / (f+1));
r = r.toString(16);
if ( r.length == 1 ) r = "0" + r;
var g = parseInt( c.substr(i, i), 16);
f = ( factor * g / (256-g) );
g = Math.floor((256 * f) / (f+1));
g = g.toString(16);
if ( g.length == 1 ) g = "0" + g;
var b = parseInt( c.substr( 2*i, i),16 );
f = ( factor * b / (256-b) );
b = Math.floor((256 * f) / (f+1));
b = b.toString(16);
if ( b.length == 1 ) b = "0" + b;
c = r+g+b;
}
return "#" + c;
}
Взяв основной метод @ Ответ Павла Я подготовил следующие два небольших метода расширения для более интуитивной (по крайней мере для меня) подписи.
public static Color LightenBy(this Color color, int percent)
{
return ChangeColorBrightness(color, percent/100.0);
}
public static Color DarkenBy(this Color color, int percent)
{
return ChangeColorBrightness(color, -1 * percent / 100.0);
}
Я изменил функцию Павла Владова, чтобы изменить даже компонент RGB, чтобы получить оттенки в любой комбинации направлений R/G/B:
Public Function ChangeColorShades(color As Color, correctionFactor As Single, bR As Boolean, bG As Boolean, bB As Boolean) As Color
Dim red As Single = CSng(color.R)
Dim green As Single = CSng(color.G)
Dim blue As Single = CSng(color.B)
If (correctionFactor < 0) Then
correctionFactor = 1 + correctionFactor
If bR Then
red *= correctionFactor
End If
If bG Then
green *= correctionFactor
End If
If bB Then
blue *= correctionFactor
End If
Else
If bR Then
red = (255 - red) * correctionFactor + red
End If
If bG Then
green = (255 - green) * correctionFactor + green
End If
If bB Then
blue = (255 - blue) * correctionFactor + blue
End If
End If
Return color.FromArgb(color.A, CInt(red), CInt(green), CInt(blue))
End Function
Вы также можете просто поработать над процентом RGB, чтобы сделать его светлее или темнее по вашему желанию. Вот пример того, как сделать цвет темнее на x%, чем он есть:
//_correctionfactory in percentage, e.g 50 = make it darker 50%
private Color DarkerColor(Color color, float correctionfactory = 50f)
{
const float hundredpercent = 100f;
return Color.FromArgb((int)(((float)color.R / hundredpercent) * correctionfactory),
(int)(((float)color.G / hundredpercent) * correctionfactory), (int)(((float)color.B / hundredpercent) * correctionfactory));
}
Еще одна вещь, которую мы можем также обратить вспять процесс, чтобы сделать его светлее. Только мы получаем результат 255 - RGB, а затем умножаем его на нужный нам процент, как в следующем примере:
private Color LighterColor(Color color, float correctionfactory = 50f)
{
correctionfactory = correctionfactory / 100f;
const float rgb255 = 255f;
return Color.FromArgb((int)((float)color.R + ((rgb255 - (float)color.R) * correctionfactory)), (int)((float)color.G + ((rgb255 - (float)color.G) * correctionfactory)), (int)((float)color.B + ((rgb255 - (float)color.B) * correctionfactory))
);
}
Надеюсь, это поможет.
Использование библиотеки конвертеров HSI (поиск в Google).А затем отрегулируйте канал I для более светлого/темного цвета.
Взгляните на класс ControlPaint:
Я сделал сайт, который делает это colorglower.com Вы можете проверить это, чтобы увидеть демо.
Вот код JavaScript, который я использовал.
function lighten(color) {
// convert to decimal and change luminosity
var luminosity = 0.01
var computedColors = new Array();
var newColor = "#",
c, i, n, black = 0,
white = 255;
for (n = 0; n < 10; n++) {
for (i = 0; i < 3; i++) {
c = parseInt(color.substr(i * 2, 2), 16);
c = Math.round(Math.min(Math.max(black, c + (luminosity * white)), white)).toString(16);
newColor += ("00" + c).substr(c.length);
}
computedColors[n] = newColor;
var arrayUnique = checkIfArrayIsUnique(computedColors);
if (arrayUnique == false) {
computedColors.pop();
break;
}
computedColors[n] = newColor;
newColor = "#";
luminosity += calcPercentage();
}
return computedColors;
}
Этот код получает шестнадцатеричный цвет, а затем выводит 10 его самых светлых цветовых версий и помещает в массив.Вы можете изменить яркость по своему усмотрению, чтобы отрегулировать процент оттенка.Чтобы затемнить цвета, вам просто нужно изменить:
luminosity -= calcPercentage();