Программно осветлить или затемнить шестнадцатеричный цвет (или RGB, и смешать цвета) - PullRequest
Новая
       52

Программно осветлить или затемнить шестнадцатеричный цвет (или RGB, и смешать цвета)

440 голосов
/ 06 апреля 2011

Вот функция, над которой я работал, чтобы программно осветлить или затемнить шестнадцатеричный цвет на определенную величину. Просто введите строку типа "3F6D2A" для цвета (col) и целое число base10 (amt) для количества, которое нужно осветлить или затемнить. Чтобы затемнить, передайте отрицательное число (т.е. -20).

Причина, по которой я это сделал, заключалась в том, что все решения, которые я нашел, до сих пор, казалось, слишком усложняли проблему. И у меня было ощущение, что это можно сделать всего несколькими строками кода. Пожалуйста, дайте мне знать, если вы обнаружите какие-либо проблемы или внесете какие-либо изменения, которые позволят ускорить его. 

function LightenDarkenColor(col,amt) {
    col = parseInt(col,16);
    return (((col & 0x0000FF) + amt) | ((((col>> 8) & 0x00FF) + amt) << 8) | (((col >> 16) + amt) << 16)).toString(16);
}

Для разработки используйте здесь более легкую для чтения версию: 

function LightenDarkenColor(col,amt) {
    var num = parseInt(col,16);
    var r = (num >> 16) + amt;
    var b = ((num >> 8) & 0x00FF) + amt;
    var g = (num & 0x0000FF) + amt;
    var newColor = g | (b << 8) | (r << 16);
    return newColor.toString(16);
}

И, наконец, версия для обработки цветов, которые могут (или не могут) иметь "#" в начале. Плюс настройка для неправильных значений цвета: 

function LightenDarkenColor(col,amt) {
    var usePound = false;
    if ( col[0] == "#" ) {
        col = col.slice(1);
        usePound = true;
    }

    var num = parseInt(col,16);

    var r = (num >> 16) + amt;

    if ( r > 255 ) r = 255;
    else if  (r < 0) r = 0;

    var b = ((num >> 8) & 0x00FF) + amt;

    if ( b > 255 ) b = 255;
    else if  (b < 0) b = 0;

    var g = (num & 0x0000FF) + amt;

    if ( g > 255 ) g = 255;
    else if  ( g < 0 ) g = 0;

    return (usePound?"#":"") + (g | (b << 8) | (r << 16)).toString(16);
}

ОК, так что теперь это не просто пара строк, но кажется, что это намного проще, и если вы не используете "#" и вам не нужно проверять цвета вне диапазона, это всего лишь пара линий.

Если вы не используете "#", вы можете просто добавить его в код, например: 

var myColor = "3F6D2A";
myColor = LightenDarkenColor(myColor,10);
thePlaceTheColorIsUsed = ("#" + myColor);

Я предполагаю, что мой главный вопрос, я прав здесь? Разве это не распространяется на некоторые (нормальные) ситуации?

Ответы [ 11 ]

0 голосов
/ 17 мая 2015

Как просто затенить цвет в PHP?

<?php
function shadeColor ($color='#cccccc', $percent=-25) {

  $color = Str_Replace("#",Null,$color);

  $r = Hexdec(Substr($color,0,2));
  $g = Hexdec(Substr($color,2,2));
  $b = Hexdec(Substr($color,4,2));

  $r = (Int)($r*(100+$percent)/100);
  $g = (Int)($g*(100+$percent)/100);
  $b = (Int)($b*(100+$percent)/100);

  $r = Trim(Dechex(($r<255)?$r:255));  
  $g = Trim(Dechex(($g<255)?$g:255));  
  $b = Trim(Dechex(($b<255)?$b:255));

  $r = ((Strlen($r)==1)?"0{$r}":$r);
  $g = ((Strlen($g)==1)?"0{$g}":$g);
  $b = ((Strlen($b)==1)?"0{$b}":$b);

  return (String)("#{$r}{$g}{$b}");
}

echo shadeColor(); // #999999
Страница:
...