４．線画の抽出プラグインを作る！（実用プログラム作成編）
前回、抽出の解析にちょっと時間を割きましたが、プログラム自体はたった４行という簡単なものでした。どうせなら、白以外のセカンダリカラー背景に描いた好きな色のプライマリーカラーの線画も抽出できるようにしたいです。今回は息抜きの絵は一切無し！チョイガチです！
（１）今回も分析！
私の知る限り、白黒以外は、背景色に描いた滑らかな線を透明レイヤに描いた線に戻す方法は有りません。でも、透明レイヤに描いた滑らかな線を単色背景レイヤにブレンド標準で合成する事は出来ます。これは背景レイヤに直接線を描いたのと同じ色になります。つまり、合成の仕組みが分かれば、逆の操作をし、透明レイヤに描いた線のように出来るはずです。
分析方法は合成前と合成後の色を比較して関係式を見つけるという、まっ前回とやる事は一緒ですが、さすがに今回は結構面倒でした。
透明レイヤに塗られた色が背景色と合成されるとき、透明レイヤに塗られた色に透明度の割合を掛けたモノと、背景レイヤの背景色に透明度の減算した割合をかけ、その二つを足した色にしてるのです。こういうのは、日本語だとよけい、分からないですね（笑）簡単な式で説明できます。
透明レイヤの線の色（プライマリカラー） Ｐc＝（PrimaryColor）
透明レイヤの線の透明度 α
背景色（セカンダリカラー）
Ｓｃ＝（SecondaryColor）
合成レイヤの線の色 Ｃc＝（CurrentPixelColor）
Ｃｃ ＝ Ｐｃ×（α／２５５）＋Ｓｃ×（１−α／２５５）・・・・・・・（１）
今やろうとしているのは、背景色セカンダリカラーScに直接描画色プライマリカラーPcで描かれた線の色Ccを透明レイヤに描いた線の色に戻す事です。透明レイヤに描いた線の色は、白黒のときと同じで、どのピクセルもＲＧＢは同じです。（でも、実際はカラーの場合、微妙〜に１とか２変わってる場合があります）アンチエイリアスのところだけ、透明度が違うだけです。ですから、上の式から透明度を求めて、それぞれのピクセルをプライマリカラーのＲＧＢに置き換えて、計算で求めた透明度αを入れてあげれば、透明レイヤに描いた線にようになるはずです。つまり、カラーの線の抽出が出来るはずです。αは上式より
α ＝ ２５５（Ｃｃ−Ｓｃ）／（Ｐｃ−Ｓｃ）・・・・・・・（２）
ここまで、分かればプログラムはできたも同然ですね！（って、ここまで解析するのに２時間かかりました（汗））
さぁ！プログラムを・・・ちょっと待った！前回の白黒の式と整合性はあるのか確かめないといけませんね。
プライマリカラー黒は０、よってＰｃ＝０、セカンダリカラー白は２５５、よってＳｃ＝２５５です。これを上式に代入します。
α ＝ ２５５（Ｃｃ−２５５）／（０−２５５）
α ＝ ２５５−Ｃｃ・・・・・・・（３）
前回の白黒限定式との整合性を確認できました。数学の授業みたい？プログラムってほとんど数学みたいなもんですからね(^^;)
（２）日本語プログラム
日本語プログラムもそろそろ、簡略化しましょう。やりたいことを整理するための覚え書きですからね。
（２）式をつくり、それぞれのピクセルにαを代入し、プライマリカラーに置き換えるというのがメインプログラムになります。
１．（Ｃｃ−Ｓｃ）の値を入れる新しい変数ｄｃｓ（ＲＧＢ）を宣言し、（CurrentPixel．ＲＧＢ）−（SecondaryColor．ＲＧＢ）を代入する
２．（Ｐｃ−Ｓｃ）の値を入れる新しい変数ｄｐｓ（ＲＧＢ）を宣言し、（PrimaryColor．ＲＧＢ）−（SecondaryColor．ＲＧＢ）を代入する
３．（２）式で求めるαの値を入れる新しい変数ｒａ（ＲＧＢ）を宣言し、初期値＝０を代入する
４．（Ｐｃ−Ｓｃ）＝０でないとき、（２）で求めた値をｒａ（ＲＧＢ）に代入する
５．実際に使用する透明度を入れる新しい変数ｒａを宣言し、初期値＝０を代入する
６．ｒａ（ＲＧＢ）の３つの値を０を除いて、算術平均しｒａに代入する
７．CurrentPixel.Aにｒａを代入する。
８．CurrentPixel．ＲＧＢにPrimaryColor．ＲＧＢを代入する
実際のプログラムでは、ＲＧＢ毎に書き、さらに条件が色々あるので結構長くなります。
（３）Ｃ＃の型宣言
今までは、サンプルプログラムの変数だけ使っていましたが、新しい変数を使わないとこのプログラムはできません。新しい変数を使うためには型を宣言しなければなりません。サンプルの中で「int
x 」や「int y」というのがでてきますが、このintが型宣言です。意味は
int＝「これから使う変数は整数型です」（正確には4byte符号付整数型）
今回は割り算があるので、実数も使いたいです。つまり小数点以下も計算したいのです。この場合は
double＝「これから使う変数は実数型です」（正確には 8byte浮動小数点型）
これらを宣言すれば、自由な変数を設定できます。
（３）メインプログラム
double dcsr = (CurrentPixel.R - SecondaryColor.R);
double dcsg = (CurrentPixel.G
- SecondaryColor.G);
double dcsb = (CurrentPixel.B
- SecondaryColor.B);
double dpsr = (PrimaryColor.R
- SecondaryColor.R);
double dpsg = (PrimaryColor.G
- SecondaryColor.G);
double dpsb = (PrimaryColor.B
- SecondaryColor.B);
double rar = 0;
double rag = 0;
double rab = 0;
if (dpsr != 0) rar =(255*(dcsr/dpsr));
if (dpsg != 0) rag =(255*(dcsg/dpsg));
if (dpsb != 0) rab =(255*(dcsb/dpsb));
int ra = 0;
if ((rar != 0)&(rag != 0)&(rab
!=
0))ra = (byte)((rar+rag+rab)/3);
if ((rar != 0)&(rag != 0)&(rab
==
0))ra = (byte)((rar+rag)/2);
if ((rar != 0)&(rag == 0)&(rab
!=
0))ra = (byte)((rar+rab)/2);
if ((rar != 0)&(rag == 0)&(rab
==
0))ra = (byte)(rar);
if ((rar == 0)&(rag != 0)&(rab
!=
0))ra = (byte)((rag+rab)/2);
if ((rar == 0)&(rag != 0)&(rab
==
0))ra = (byte)(rag);
if ((rar == 0)&(rag == 0)&(rab
!=
0))ra = (byte)(rab);
CurrentPixel.A = (byte)ra;
CurrentPixel.R = (byte)PrimaryColor.R;
CurrentPixel.G = (byte)PrimaryColor.G;
CurrentPixel.B = (byte)PrimaryColor.B;
|
さっそく、CodeLabに書いていきます。
右のプログラムが
CurrentPixel = src[x,y]; 〜 dst[x,y] =
CurrentPixel;
の間に入るわけです。今回は文字列にしたので、試してみたい方はコピペしてください。
長いですが、日本語プログラムで書いた事をＲＧＢ毎に処理してるだけです。
このプログラムで分かったんですが、ｄｃｓやｄｐｓは整数でいいはずなんですが、intを宣言してしまうと、割り算のとき具合が悪いんです。良く分かってませんがそれでｄｏｕｂｌｅを宣言しています。if文はこのシリーズ２回目で使ったので、読んだ方は分かると思います。＆はそのままアンド。論理積です。
つまり、
if (A＆B) C 「AかつＢ なら Ｃの処理をしなさい」
スペースが余ったので、ちょい別のコマンドの説明も私が理解してる範囲で加えましょう。たぶん、もう大体は分かってると思いますが・・・
for (int y = rect.Top; y < rect.Bottom;
y++)
forというのは繰り返し処理
ｙ方向は上から下に繰り返してくださいみたいなことですね。
for (int x = rect.Left; x < rect.Right;
x++)
ｘ方向は左から右に繰り返してください
CurrentPixel = src[x,y];
カレントピクセルにｘｙ座標のピクセルの情報を代入しなさい
dst[x,y] = CurrentPixel;
カレントピクセルの情報をｘｙ座標のピクセルに代入しなさい
８００ｘ６００だったら、４８００００回も繰り返してるワケですね。
ところで、なんで「メインプログラム」としてるかってのは、これで確かに目的達成なんですが、実用としては、色々処理条件を付けたいわけです。これは、ワンクリックエフェクトなので、間違って２回掛けるとおかしな事になってしまいます。それを回避したり、処理を速める工夫をしたりしたいわけです。
■今回のまとめ
●新しい変数を使う時は、型宣言する。
●int 4byte符号付整数型
●double 8byte浮動小数点型
●if (A＆B) C 「AかつＢ なら Ｃの処理をしなさい」
次回は処理条件を加えていよいよ線画抽出プラグインを完成させます！
前の記事に戻る 目次へ戻る 次の記事へ進む
|
このページの最終更新