Bagaimanakah saya boleh mencerahkan atau menggelapkan warna HEX, mengendalikan warna RGB dan menggabungkan warna bersama-sama?

Mencerahkan atau Menggelapkan warna HEX (atau RGB, dan menggabungkan warna secara Program)

Masalahnya

Matlamatnya adalah untuk mencipta fungsi yang boleh mencerahkan atau menggelapkan warna heks dengan jumlah tertentu. Selain itu, anda ingin mengendalikan warna RGB dan menggabungkan warna bersama-sama.

Penyelesaian

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

// TEST
console.log(LightenDarkenColor("3F6D2A", 40));

Penjelasan

Fungsi ini berfungsi dengan menukar warna heks kepada integer, menambah atau menolak amaun yang ditentukan kepada setiap saluran RGB, dan kemudian menukarkan hasilnya kembali kepada warna heks.

Penambahan

Untuk meningkatkan fungsi, anda boleh menambah pengendalian ralat dan sokongan untuk pelbagai format warna (RGB, HSL). Anda juga boleh menambah keupayaan untuk menggabungkan warna bersama-sama dengan menghantar parameter warna kedua.

Inilah Versi Yang Diperbaiki:

<code class="javascript">function pSBC(p, c0, c1, l) {
  let r, g, b, P, f, t, h, i = parseInt;
  if (typeof(p) != "number" || p <-1 || p > 1 || typeof(c0) != "string" || (c0[0] != 'r' &amp;&amp; c0[0] != '#') || (c1 &amp;&amp; !a)) return null;
  if (!this.pSBCr) this.pSBCr = (d) => {
    let n = d.length, x = {};
    if (n > 9) {
      [r, g, b, a] = d = d.split(",");
      n = d.length;
      if (n < 3 || n > 4) return null;
      x.r = i(r[3] == "a" ? r.slice(5): r.slice(4), 16);
      x.g = i(g);
      x.b = i(b);
      x.a = a ? parseFloat(a) : -1;
    } else {
      if (n == 8 || n == 6 || n < 4) return null;
      if (n < 6) d = "#" + d[1] + d[1] + d[2] + d[2] + d[3] + d[3] + (n > 4 ? d[4] + d[4] : "");
      d = i(d.slice(1), 16);
      if (n == 9 || n == 5) x.r = d >> 24 &amp; 255, x.g = d >> 16 &amp; 255, x.b = d >> 8 &amp; 255, x.a = m((d &amp; 255) / 0.255) /1000;
      else x.r = d >> 16, x.g = d >> 8 &amp; 255, x.b = d &amp; 255, x.a = -1;
    }
    return x;
  };

  h = c0.length > 9;
  h = a ? c1.length > 9 ? true : c1 == "c"?!h : false : h;
  f = this.pSBCr(c0);
  P = p < 0;
  t = c1 &amp;&amp; c1 != "c" ? this.pSBCr(c1) : P ? {r:0,g:0,b:0,a:-1} : {r:255,g:255,b:255,a:-1};
  p = P ? p*-1 : p;
  P = 1-p;
  if (!f || !t) return null;
  if (l) r = m(P*f.r + p*t.r), g = m(P*f.g + p*t.g), b = m(P*f.b + p*t.b);
  else r = m((P*f.r**2 + p*t.r**2)**0.5), g = m((P*f.g**2 + p*t.g**2)**0.5), b = m((P*f.b**2 + p*t.b**2)**0.5);
  a = f.a, t = t.a, f= a >= 0 || t >= 0, a = f ? a < 0 ? t : t < 0 ? a : a*P + t*p : 0;
  if (h) return "rgb" + (f ? "a(" : "(") +r + "," +g + "," +b + (f ? "," + m(a*1000)/1000 : "") + ")";
  else return "#" + (4294967296+r*16777216+g*65536+b*256+(f ? m(a*255):0)).toString(16).slice(1, (f? undefined : -2));
}</code>

Versi yang dipertingkat ini termasuk ciri-ciri berikut:

• Ralat pengendalian: Fungsi menyemak input tidak sah dan mengembalikan null jika input tidak sah.
• Sokongan untuk format warna yang berbeza: Fungsi menyokong format warna hex, RGB dan RGBA.
• Campuran warna: Anda boleh menggabungkan dua warna bersama-sama dengan menghantar parameter warna kedua.
• Linear atau logaritma pengadunan: Anda boleh menentukan sama ada hendak menggunakan pengadun linear atau logaritma dengan menghantar parameter keempat.
• Sokongan saluran alpha: Fungsi menyokong saluran alfa dan anda boleh menggabungkan saluran alfa bersama apabila menggabungkan warna.

Atas ialah kandungan terperinci Bagaimanakah saya boleh mencerahkan atau menggelapkan warna HEX, mengendalikan warna RGB dan menggabungkan warna bersama-sama?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!