【ColorMatrixFilter】

com.quasimondo.geom.ColorMatrix v2.1がステキ

Actionscript3

Hydrotweenのcolor(色)tweenにバグがあったおかげで、ColorMatrixを集中的に調べることができた。
普段何気なく使っているグラフィックツールに同じ機能があったり、勉強になった。

また、Mario KlingemannさんのColorMatrixクラスに巡り会えた幸せな旅だった。
Nomadic FunctionsのJavascriptで作られたColorMarix関数は感激もの。
輝度(Luminance)の不思議にも出会うことができたのは大収穫。

com.quasimondo.geom.ColorMatrixを試しに使ってみた。
全部試してはないけど、どうも相当イケテル予感。
com.gskinner.geom.ColorMatrixでドギモを抜かれたけどそれ以上かも・・・
Saturation, Contrast, Brightness, Hue はもちろん Invertも一発、他にもどう使うのかまだ理解できないrotateHueなんて関数も用意されていて、超強力布陣。
グラフィックの勉強をちゃんとしないと使いこなせそうにナイ。

The Flash plugin is required.

5×4のMatrixを生成するのでColorMarixFilterにセットして使いなナ感じ。
引数の値の範囲がよくわからない関数がある、さらに検証。。。
緑のワクがオリジナル。

import com.quasimondo.geom.ColorMatrix;
 
var cm:ColorMatrix = new ColorMatrix();
cm.invert();
target0.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustSaturation(-2);
target1.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustSaturation(2);
target2.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustContrast(-1);
target3.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustContrast(1);
target4.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustBrightness(128);
target5.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustBrightness(0,128);
target6.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustBrightness(0,0,128);
target7.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustHue(90);
target8.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustHue(180);
target9.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.adjustHue(-90);
target10.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rotateHue(90);
target11.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rotateHue(180);
target12.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rotateHue(270);
target13.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.luminance2Alpha();
target14.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.setChannels();
target15.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.setAlpha(0.5);
target16.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.averageRGB2Alpha();
target17.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.invertAlpha();
target18.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(0,1,1);
target19.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(1,0,1);
target20.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(1,1,0);
target21.filters = [new ColorMatrixFilter(cm.matrix)];
 
cm.reset();
cm.rgb2Alpha(.5,.5,.5);
target22.filters = [new ColorMatrixFilter(cm.matrix)];
Bookmark and Share

HydroTween, ColorMatrixFilterでcolorをtweenできる?(3)

Actionscript3 HydroTween

HydroTweenは色(color)をtweenする時、hexをRGB成分に分解した後ColorMatrixFilterの成分にセットするところで、luminance定数にx2.81している。
作者のdonovanさんの意図が良く分からないが、なにか理由があるのかもしれない?

x2.81をしないとどうなるか試してみる。
この投稿の続きを読む »

Bookmark and Share

HydroTween, ColorMatrixFilterでcolorをtweenできる?(2)

Actionscript3 HydroTween

hex(0xRRGGBB)をRGBに分解する。
Quasimondo – Mario KlingemannのColorMatrix 、Grant SkinnerさんのColorMatrixとHydroTweenを参考にした。

hex:uintをRGB成分を持った配列へ変換する関数。

function hexToRGB(rgb:int, returnmode:Boolean=false):Array{
	var r:Number;
	var g:Number;
	var b:Number;
 
	r = (((rgb >> 16 ) & 0xFF) / 0xFF);
	g = (((rgb >> 8 ) & 0xFF) / 0xFF);
	b = ((rgb & 0xFF ) / 0xFF);
 
	if (returnmode) return [r*255,g*255,b*255];
	return [r,g,b];
}


1.hexToRGB(0xff0000); // [1,0,0]
2.hexToRGB(0xff0000,true); // [255,0,0]

この投稿の続きを読む »

Bookmark and Share

HydroTween, ColorMatrixFilterでcolorをtweenできる?(1)

Actionscript3 HydroTween

HydroTweenはcolorプロパティ(色)のtweenにColorMatrixFilterを使っている。
hue,saturation,contrast,brightnessなどの変化に使われているアレ。
Grant SkinnerさんのColorMatrixが移植されている。
このmatrix、分かる人には分かるのだろうけど相当難しい。

ColorMatrixFilterを使って任意の色指定ができるのかHydroTweenを参考に調べてみる。
この投稿の続きを読む »

Bookmark and Share

HydroSequence, HydroTweenでColorMatrix(hue,saturation,contrast,brightness)をtween

Actionscript2

HydroSequence, HydroTweenにはhue,saturation,contrast,brightnessをtweenできる。
FlashのColorMatrixFilterを時系列で更新している、コア部分はGrant SkinnerさんのColorMatrixクラスが移植されていた。

Actionscript 2時にリリースされ、自分なりにextendsしたクラスを作ったりもし大変お世話になったクラスの一つ。
AS3ように自分でアップデートしていたが実際にはAS3版もリリースされていたのは、HydroTweenのソースにクレジットが記述されていて気がついた。

AS2:http://www.gskinner.com/blog/archives/2005/09/flash_8_source.html
AS3:http://www.gskinner.com/blog/archives/2007/12/colormatrix_upd.html

AS2で作ったhue,saturation,contrast,brightnessシュミレーター。

The Flash plugin is required.

Bookmark and Share

HydroTween.go colorプロパティtweenの仕様

Actionscript3 HydroTween

HydroTween.go colorプロパティのtweenにバグ? 
のエントリーの後、作者のdonovanさんに問い合わせてみたところ「そんなことないよ」とのお返事、ものすごく返事が早くてビックリ!しかも君のコードを見てあげるよとの親切な申し出、感謝!
色々試しているうちに、初めから色がついているものでRGBのRGのどちらかが255でないと何となくうまく行かないような気がしてきた。

インスタンスは白(0xFFFFFF)にし色はHydroTweenかHydroSequenceでつけると全てうまく行くことに気がつく。
バグではなくmatrixに由来する仕様なんだと思う。

でもでも、手作業でつける色と違ったりする色もある様子。HydroTweenが、と言うよりFlashの問題になるのかなぁ。。。

クリックすると色がtweenし最後に赤、真ん中と右端は最初の色が違うだけで同じtween。

The Flash plugin is required.

donovanさんからメール。
colorをtweenする時の輝度計算に問題があるようだ、
修正できるようにがんばってみるけど大変そうだなぁ、とのこと。

色変化にColorTransformでなくColorMatrixFilterを使っていることに原因があるのかも。
ColorMatrixFilterで色を変えるとは、ColorTransformの方が簡単そうなのに。

Bookmark and Share
WP Theme & Icons by N.Design Studio
RSS