色の設定 – FlyWithLua

RGB 0-1カラーピッカーを変換してくれるサイト：https://rgbcolorpicker.com/0-1

この色指定は1と0だけで指定する方法で、現在ほとんど使われていない。しかしFlyWithLuaではこれが使われているので色の選択が非常に難しい状態になっている。
あんまり色は使わないといえばそれまでだが、こだわったときは非常に困ることになる。頑張って調べてみた。

RGB 0-1カラーピッカー

RGB 0-1とは何?

RGB(赤、緑、青)は、赤、緑、青の3つの原色の組み合わせとして色を表すカラーモデルです。通常、各原色は0から255の間の値で表され、0は最小強度、255は最大強度です。この表現はRGB 0-255として知られています。

RGB 0-1では、色の値は0と255ではなく0と1の間の小数点として表されます。これは、色表現と操作の精度を高めるため、画像処理やグラフィックスソフトウェアで作業する場合に便利です。たとえば、RGB 0-255色（255、128、64）は、RGB 0-1で（1.00、0.50、0.25）として表されます。

RGB 0-1をRGB 0-255との間で変換する方法は？

RGB 0-255からRGB 0-1に変換するには、各カラーチャンネルの値を255で割ります。
RGB 0-1からRGB 0-255に変換するには、各カラーチャンネルの値に255を掛けます。

RGB 0-1は他にどのような名前で言及されていますか?

RGB 0-1は「ユニットRGB」とも呼ばれます。これは、値が0から1(単位)の範囲に正規化され、1が最大強度であるためです。これは、値が0から255の範囲で、255が最大強度である典型的なRGB表現とは異なります。

RGB 0-1は、値が小数点または浮動小数点数として表されるため、「Float RGB」または「Decimal RGB」とも呼ばれます。これは、値が整数として表される典型的なRGB表現とは異なります。

変換後の色

変換してくれるサイト：https://rgbcolorpicker.com/0-1

rgb01(0, 0, 0) = #000000（黒）
rgb01(0, 0, 1) = #0000ff（青）
rgb01(0, 1, 0) = #00ff00（緑）
rgb01(0, 1, 1) = #00ffff（シアン）
rgb01(1, 0, 0) = #ff0000（赤）
rgb01(1, 0, 1) = #ff00ff（マゼンタ）
rgb01(1, 1, 0) = #ffff00（黄）
rgb01(1, 1, 1) = #ffffff（白）

R（赤）	G（緑）	B（青）	作成カラー
0	0	0	黒
0	0	1	青
0	1	0	緑
0	1	1	シアン
1	0	0	赤
1	0	1	マゼンタ
1	1	0	黄
1	1	1	白

最後のここの説明は実行したことがないが、微妙な色を指定する場合は小数点でも使えるのかな？と思ったので一応メモとして残しと置く。
閉じた間隔[0, 1]の浮動小数点数のRGBまたはRGBA（赤、緑、青、アルファ）タプル。
(0.1, 0.2, 0.5)
(0.1, 0.2, 0.5, 0.3)

16進数カラーコード

テキストの色を指定

imgui.PushStyleColor(imgui.constant.Col.Text, 0xFFA89300) — 色を指定、濃いブルーのテキスト
imgui.TextUnformatted(“Hello World!”)　–テキストを入れる
imgui.PopStyleColor() –これで閉じる

ボタンの色を指定

imgui.PushStyleColor(imgui.constant.Col.Button, 0xFFA89300)–ボタンの色を指定
if imgui.Button(“Hello World!”) then –ボタンのテキスト
–内容を記
end
imgui.PopStyleColor() –これで閉じる

ボタンの上にマウスが乗った時の色

imgui.PushStyleColor(imgui.constant.Col.ButtonHovered, 0xFFA89300)–ボタンの色を指定
if imgui.Button(“Hello World!”) then –ボタンのテキスト
–内容を記
end
imgui.PopStyleColor() –これで閉じる

ボタンを押し下げした時の色

imgui.PushStyleColor(imgui.constant.Col.ButtonActive, 0xFFA89300)–ボタンの色を指定
if imgui.Button(“Hello World!”) then –ボタンのテキスト
–内容を記
end
imgui.PopStyleColor() –これで閉じる

FlyWithLuaでは10桁の16進カラーコードが使われているようだが、一般的な16進数（8桁）をそのまま使用しても色が出ないということになる。

例えば一般的な純粋の赤の16進コードは「0x0000FF」と8桁で構成されている。これをそのままFlyWithLuaに色指定で入れても何も表示されない。10桁のこれが正解になる「0xFF0000FF」。
何が違うか、上の16進コードの「0x」を除く後ろの赤色6桁を「0xFF」に追加して10桁にすると使えるようになる。
別の言い方をすると16進の「0x」の後ろに「FF」を追加して10桁にするということも言える。0xFF0000FF

下の例では：純粋の青「0xFFFF0000」、純粋の緑「0xFF00FF00」、純粋の赤「0xFF0000FF」。赤指定のFFを外したのが16進数になり、入れた分がFlyWithLuaで使えるカラーコードになる。読み方は分からない、同じ16進数というのかどうか？
要するに、10桁がFlyWuthLua用になるということ。

色を探すときには16進数で探して「0x」の後ろに「FF」を入れると良いということになる。

この「0x」の後の追加した「FF」の2文字、実は透明度を指定するコードになる。FlyWithLuaの場合はこの透明度コードが入っていないと色が表示されない。透明度の指定に関しては以下で説明する。

透明度の設定

例えば：0xFF0000FF
最初の0xの後のFFは透明度0%、もしここを00にしたら透明度100%（見えなくなる）、以下は透明度50%「80」に指定した例になる。

コンピューターで色を表現するための透明度の範囲は（16進数では00〜FF）。（00）は完全に透明であることを意味し、（FF）は、完全に不透明であることを意味する。透明度の設定は以下の通りになる。

透明度	コード
100%	00
95%	0D
90%	1A
85%	26
80%	33
75%	40
70%	4D
65%	59
60%	66
55%	73
50%	80
45%	8C
40%	99
35%	A6
30%	B3
25%	BF
20%	CC
15%	D9
10%	E6
5%	F2
0%	FF