色の段階

色には段階というものが存在します。実際にProcessingで色を指定するには、カラーモードというものを指定した後に色の値を指定します。 RGBは最大256で、HSBはHが360、SとBが最大100です。
文字の上だと分かりずらいと思うので以下に例を載せます。


まずカラーセレクターで色を指定します。下記の図のような位置の色を指定しました。

これをHSBで色の指定をしたい場合以下のように記述します

size(200,200);
//カラーモードの設定(HSBで色を指定する)
colorMode(HSB);
//背景色の指定
background(357,99,99);

細かいプログラムの説明は次回しますが、colorModeが色の設定方法(RGBかHSB)、 backgroundが背景色の指定方法です。この例では色の段階を設定していません。 さて結果はどうなるでしょうか?

結果は色の段階を設定していないため、全然違う色が表示されてしまいました。 これを正確なものにするには、カラーモードの設定(2行目)で色の段階を設定します。

size(200,200);
colorMode(HSB,360,100,100);
background(357,99,99);

上記は色の指定をHSBにし、Hの色域を360、SとBの色域をそれぞれ100にしています。 設定する背景色はHが357、SとBが99なため色域を満たしています。 そのため正式な色を設定することができています。 ちなみにカラーモードは一度指定すると、設定を解除するまで残り続けます。 HSBからRGBに変えたいときは再度colorModeで色域を設定してください。

ProcessingのデフォルトのカラーモードはRGBになっていますが、RGBは特に色域の設定をしない場合、 色の段階は0〜255の範囲が設定されています。またHTML表記での色の指定はカラーモードの設定はしなくても大丈夫です。 そのため慣れないうちはRGBかHTMLのカラーコードで色を指定するとよいかもしれません。

広告