10

一部のコードを変更する必要があり、以前の開発者は次のコメントを残しました。

color: color, // e.g. '#RRGGBBFF' - Last 2 digits are alpha information

このページには、ユーザーがテキストの色を変更できるカラー ピッカーがあります。次のような HEX 値が得られます。

#RRGGBB

また、ユーザーがテキストの透明度を変更できるスライダーがあります。から0.1_1

どういうわけか、この透明度から 2 桁の文字を取得し、それを HEX 値に追加して機能させる必要があります。

アルファ情報をHEXカラーコードに追加する方法を知っている人はいますか? その数式は何ですか?

透明度のあるRGBAカラー値をHEXに変換する方法を誰かが知っていれば、質問にも答えられると思います。

rgba(255, 255, 255, 0.6)
4

6 に答える 6

6

2 桁の16 進数の最大値255 = (16 ** 2 - 1)と最小値は0アルファには最大値1と最小値0があるため、単純な問題です。

// say we start with        e.g. alpha = 0.3
x = alpha * 255;  // float, e.g. x = 76.5

これは常に整数であるとは限らないため、たとえば以下を使用して整数に変換する必要があります。

y = Math.floor(x);  // int, e.g. y = 76

これをbase-16文字列に変換すると、目的の出力が得られます

s = y.toString(16); // str, e.g. s = "4c"

最後に、y < 16これが 1 桁のみになる場合は、余分なパディングが必要になる場合があります。 0

ret = y < 16 ? '0' + s : s;
于 2013-11-05T21:58:01.080 に答える
1

W3C 仕様の関連部分によると、RGBA 値の 16 進バージョンはありません。その仕様からの引用:

RGB 値とは異なり、RGBA 値には 16 進表記がありません。

したがって、回避策は、rgba(r, g, b, a)フォーマットを使用するか、透明度を個別に設定することです。

于 2013-11-05T21:57:16.527 に答える
1

いつものように、線形スケーリングを使用します。

(vald - マインド) / (maxd - マインド) * (maxr - minr) + minr

(0.1 - 0.0) / (1.0 - 0.0) * (255 - 0) + 0 = 25.5 ~= 0x1a

于 2013-11-05T21:57:23.013 に答える