Re: [Flashcoders] RGB tinting using the colorMatrixFilter()
not sure I made myself clear - given a desaturated greyscale image I need to be able to tint it to an RGB value - so black stays black, white stays white and rgb=128,128,228 (50% grey) is the actual colour - with all the shade in between. I need to be able to do this by using code like this: [as3] trace(composite startTime:+getTimer()); // tint var matrix:Array = new Array(); matrix = matrix.concat([r1, r2, r3, r4, r5]); matrix = matrix.concat([g1, g2, g3, g4, g5]); matrix = matrix.concat([b1, b2, b3, b4, b5]); matrix = matrix.concat([a1, a2,a3, a4, a5]); var tintFilter = new ColorMatrixFilter(matrix); [/as3] so how do I work out the r's g's and b's in the matrix? Cheers Mike ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
Re: [Flashcoders] RGB tinting using the colorMatrixFilter()
I may be wrong, but I don't think you can do it just with a color matrix, but you could try drawing the solid color you want to tint with, and use the greyscale image with the hardlight blendmode on top. I think that should give you the desired effect. check out http://www.simpelfilter.de/en/grundlagen/mixmods.html or google for hardlight blendmode. --Brian On 5/10/07, Mike Mountain [EMAIL PROTECTED] wrote: not sure I made myself clear - given a desaturated greyscale image I need to be able to tint it to an RGB value - so black stays black, white stays white and rgb=128,128,228 (50% grey) is the actual colour - with all the shade in between. I need to be able to do this by using code like this: [as3] trace(composite startTime:+getTimer()); // tint var matrix:Array = new Array(); matrix = matrix.concat([r1, r2, r3, r4, r5]); matrix = matrix.concat([g1, g2, g3, g4, g5]); matrix = matrix.concat([b1, b2, b3, b4, b5]); matrix = matrix.concat([a1, a2,a3, a4, a5]); var tintFilter = new ColorMatrixFilter(matrix); [/as3] so how do I work out the r's g's and b's in the matrix? Cheers Mike ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
RE: [Flashcoders] RGB tinting using the colorMatrixFilter()
Does it need to be using ColorMatrixFilter ? I have a Tint utility class that does exactly what you want but it's a simple color transform on a MovieClip: http://www.daroost.ca/download/Tint.as It's in AS2 but I guess you could try and change it to work in AS3 ... HTH Alain -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Mike Mountain Sent: 10 mai 2007 05:40 To: flashcoders@chattyfig.figleaf.com Subject: Re: [Flashcoders] RGB tinting using the colorMatrixFilter() not sure I made myself clear - given a desaturated greyscale image I need to be able to tint it to an RGB value - so black stays black, white stays white and rgb=128,128,228 (50% grey) is the actual colour - with all the shade in between. I need to be able to do this by using code like this: [as3] trace(composite startTime:+getTimer()); // tint var matrix:Array = new Array(); matrix = matrix.concat([r1, r2, r3, r4, r5]); matrix = matrix.concat([g1, g2, g3, g4, g5]); matrix = matrix.concat([b1, b2, b3, b4, b5]); matrix = matrix.concat([a1, a2,a3, a4, a5]); var tintFilter = new ColorMatrixFilter(matrix); [/as3] so how do I work out the r's g's and b's in the matrix? Cheers Mike ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com No virus found in this incoming message. Checked by AVG Free Edition. Version: 7.5.467 / Virus Database: 269.6.6/795 - Release Date: 2007-05-09 15:07 No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.467 / Virus Database: 269.6.6/795 - Release Date: 2007-05-09 15:07 ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
Re: [Flashcoders] RGB tinting using the colorMatrixFilter()
never mind, using colorTransform instead - much easier, but had to adapt some other stuff. Would seem I can't have a single solution using colorMatrix - nevermind. Cheers M ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
Re: [Flashcoders] RGB tinting using the colorMatrixFilter()
my solution should work [see previous post]! have you tried it? or am i wrong? Brian Williams wrote: I may be wrong, but I don't think you can do it just with a color matrix, but you could try drawing the solid color you want to tint with, and use the greyscale image with the hardlight blendmode on top. I think that should give you the desired effect. check out http://www.simpelfilter.de/en/grundlagen/mixmods.html or google for hardlight blendmode. --Brian On 5/10/07, Mike Mountain [EMAIL PROTECTED] wrote: not sure I made myself clear - given a desaturated greyscale image I need to be able to tint it to an RGB value - so black stays black, white stays white and rgb=128,128,228 (50% grey) is the actual colour - with all the shade in between. I need to be able to do this by using code like this: [as3] trace(composite startTime:+getTimer()); // tint var matrix:Array = new Array(); matrix = matrix.concat([r1, r2, r3, r4, r5]); matrix = matrix.concat([g1, g2, g3, g4, g5]); matrix = matrix.concat([b1, b2, b3, b4, b5]); matrix = matrix.concat([a1, a2,a3, a4, a5]); var tintFilter = new ColorMatrixFilter(matrix); [/as3] so how do I work out the r's g's and b's in the matrix? Cheers Mike ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
RE: [Flashcoders] RGB tinting using the colorMatrixFilter()
function rgbToMatrix ( r, g, b, a )
{
var matrix:Array = new Array();
matrix = matrix.concat([r, 0, 0, 0, 0]); // red
matrix = matrix.concat([0, g, 0, 0, 0]); // green
matrix = matrix.concat([0, 0, b, 0, 0]); // blue
matrix = matrix.concat([0, 0, 0, a, 0]); // alpha
return matrix;
}
var matrix = rgbToMatrix ( 1, 1, 0, 100 );
var filter = new flash.filters.ColorMatrixFilter ( matrix );
mc.filters = [ filter ];
or
function hexToMatrix ( hex, alpha )
{
var matrix:Array = [];
matrix = matrix.concat([((hex 0x00FF) 16)/255, 0, 0, 0, 0]);
// red
matrix = matrix.concat([0, ((hex 0xFF00) 8)/255, 0, 0, 0]); //
green
matrix = matrix.concat([0, 0, (hex 0x00FF)/255, 0, 0]); // blue
matrix = matrix.concat([0, 0, 0, alpha/100, 0]); // alpha
return matrix;
}
var matrix = hexToMatrix ( 0x44DAFF, 100 );
var filter = new flash.filters.ColorMatrixFilter ( matrix );
mc.filters = [ filter ];
_
Jesse Graupmann
www.jessegraupmann.com
www.justgooddesign.com/blog/
_
-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Mike
Mountain
Sent: Thursday, May 10, 2007 2:40 AM
To: flashcoders@chattyfig.figleaf.com
Subject: Re: [Flashcoders] RGB tinting using the colorMatrixFilter()
not sure I made myself clear - given a desaturated greyscale image I need to
be able to tint it to an RGB value - so black stays black, white stays white
and rgb=128,128,228 (50% grey) is the actual colour - with all the shade in
between. I need to be able to do this by using code like this:
[as3]
trace(composite startTime:+getTimer());
// tint
var matrix:Array = new Array();
matrix = matrix.concat([r1, r2, r3, r4, r5]);
matrix = matrix.concat([g1, g2, g3, g4, g5]);
matrix = matrix.concat([b1, b2, b3, b4, b5]);
matrix = matrix.concat([a1, a2,a3, a4, a5]);
var tintFilter = new ColorMatrixFilter(matrix);
[/as3]
so how do I work out the r's g's and b's in the matrix?
Cheers
Mike
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
Re: [Flashcoders] RGB tinting using the colorMatrixFilter()
it uses copyChannel method fro BitmapData class (1 = red, 2 = green, 4 = blue, 8 = alpha) import flash.display.BitmapData; import flash.geom.Rectangle; import flash.geom.Point; var background_bmp:BitmapData = new BitmapData(this._width, this._height); background_bmp.draw(blackWhite); blackWhite.attachBitmap(background_bmp, 1); //Medium Grayscale background_bmp.copyChannel(background_bmp, background_bmp.rectangle, new Point(0, 0), 2, 1); background_bmp.copyChannel(background_bmp, background_bmp.rectangle, new Point(0, 0), 2, 2); background_bmp.copyChannel(background_bmp, background_bmp.rectangle, new Point(0, 0), 2, 4); []'s Leandro Amano On 5/9/07, Mike Mountain [EMAIL PROTECTED] wrote: Hey guys I'm working with greyscale images - assume neutral colour temperature is 50% grey. These are shaded from white to black, white representing light, black shading, and all the variable shades in between etc. I need to tint the greyscale bitmapData to produce a shaded coloured image using the colorMatrixFilter() from an RGB or Hex value. so if the whole image was 50% grey (ie. r=128, g=128, b=128) it should become r=256,g=0,b-0 - black should stay black, white should stay white but the colours in between should be shades of red. Anyone got a clue how I can do this? Cheers Mike ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com -- -- Leandro Amano Digital Bug Chief Creative Officer Adobe Certified Expert Adobe Certified Instructor Adobe User Group Leader ___ Flashcoders@chattyfig.figleaf.com To change your subscription options or search the archive: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders Brought to you by Fig Leaf Software Premier Authorized Adobe Consulting and Training http://www.figleaf.com http://training.figleaf.com
Re: [Flashcoders] RGB tinting using the colorMatrixFilter()
This might not be the most elegant solution, but since you know 128 =
full shift to new value and 0 and 256 = no shift to new value you can
use a formula to calculate the shift and then build the new rgb value
after the calculations are complete.
Assuming you want a linear relationship, it would look something like:
GRAPH: Multiplier vs Value:
*0 128 256
1/ \
. / \
. / \
0 / \
[pardon my ascii art!!]
CODE:
//check if original R/G/B component value is above middle point or
//bellow it:
if (originalValue:Number 128):Number {
multiplyer = 128 * (originalValue/128);//ratio
} else {
multiplyer = 128 * ((256-originalValue)/128);//ratio
}
//originalValue is the r or g or b parameter you are
//transforming, you run this function once per r,g,b component
//in other words: run this function 3 times! for full r/g/b
//or use a matrix transform...
newValue = valueToConvert * multiplyer;
return newValue;//assuming you put this code in a function call?
}
haven't checked the math, there might be an error in my formula...
:P
hope this helps!
with kind,
seb.
Mike Mountain wrote:
Hey guys
I'm working with greyscale images - assume neutral colour temperature is
50%
grey. These are shaded from white to black, white representing light, black
shading, and all the variable shades in between etc.
I need to tint the greyscale bitmapData to produce a shaded coloured image
using the colorMatrixFilter() from an RGB or Hex value.
so if the whole image was 50% grey (ie. r=128, g=128, b=128) it should
become r=256,g=0,b-0 - black should stay black, white should stay white but
the colours in between should be shades of red.
Anyone got a clue how I can do this?
Cheers
Mike
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
___
Flashcoders@chattyfig.figleaf.com
To change your subscription options or search the archive:
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
Brought to you by Fig Leaf Software
Premier Authorized Adobe Consulting and Training
http://www.figleaf.com
http://training.figleaf.com
