Something I’ve been meaning to do for a while now is port our ColorMatrix class to AS3. It’s a fairly simple conversion, but is still a handy utility to have on hand.
If you haven’t used the ColorMatrix class before, here is the description from when we first released it in 2005:
ColorMatrix provides a way to adjust Brightness, Contrast, Saturation and Hue based on a range of numeric values as well as multiply matrices. The ColorMatrix can then be passed into ColorMatrixFilter to apply color adjustments. The added bonus of ColorMatrix is that it uses the same calculations to generate matrix values as the Flash 8 IDE (with the exception of contrast adjustment which uses linear interpolation to provide a bit more granularity).
Download the updated source here
Here is a quick sample of it in use. This demo is included in the download package.
This class is absolutely brilliant – I’ve been needing a class like this for a long time. Good work!
Sliders would be better for demo purposes 😉
Thanks for sharing!
Good work! This class is perfect. I’ve been needing a class like this.
Great work!
Has anyone ever attempted to translate Flash color matrices to other languages?
Specifically I’ve got a project where we’re allowing a User to modify an image within Flash but would like to accurately translate the final effect to ImageMagick for export.
This is Brad from the CN talk you gave in Atlanta. Matrix manipulation confounds me so this is really helpful. Thanks for posting it.
Ferris,
It should be fairly easy to translate Flash Color matrices to other languages. The only issue is that Flash uses 4×5 matrices whereas most languages use 5×5 matrices. You’ll note that the ColorMatrix class actually has to “pad” the matrix to 5×5 in order to carry out matrix multiplication.
Great – this class is perfect. Thanks – I’ll be back soon, bye !
Using the adjustColor class is removing any filters I had set with AS (but not the ones set on the stage) and vice versa if I re-apply the filter it strips off the color effects…any suggestions for getting around this?
Oops, disregard the part about it not affecting some filters…those were unaffected becuase they were on a nested object…but any time they are applied to the same object the new effect removes the previous one.
Super travail, merci !!!!
line 80 x = 127+p_val/100*127
expected ; at end of line
very nice and thanks for sharing.
Simple and useful. Thanks.
Is there some magic implementation of the ColorMatrix that would handle colorization?
Like: Every paint programs hue/saturation filter panel has that ‘colorize’ check box that seems to inject a specific hue into grey scale values.
Being able to turn a white icon blue while maintaining gradients/antialiasing would be a handy tool to have in your back pocket.
Aaron
Re: “Ferris,
It should be fairly easy to translate Flash Color matrices to other languages. The only issue is that Flash uses 4×5 matrices whereas most languages use 5×5 matrices. You’ll note that the ColorMatrix class actually has to “pad” the matrix to 5×5 in order to carry out matrix multiplication.”
— Later versions of ImageMagick (6.3+ I think) have a -recolor option which in theory can take the same 5×5 matrix (with the bottom row being padded with the identity row (0 0 0 0 1)). It does not seem to be able to handle a 5×5 matrix correctly though, but it will recognize a 3×3 matrix which is a subset of the 5×5:
eg: For 5×5 matrix:
[RR RG RB RA RO
GR GG GB GA GO
BR BB BB BA BO
AR AB AB AA AO]
You can input
[RR RG RB
GR GG GB
BR BG BB]
into the ImageMagick command line convert utility will yield the same color translation:
Eg: convert original.jpg -recolor ‘.3 .59 .11 .3 .59 .11 .3 .59 .11’ greyscale.jpg
Note: All of the values in the 3×3 matrix must be positive numbers. For an inversion like ‘-.3 -.59 -.11 -.3 -.59 -.11 -.3 -.59 -.11’ just use ‘.3 .59 .11 .3 .59 .11 .3 .59 .11’ as the matrix but add the -negate flag to the command:
convert original.jpg -recolor ‘.3 .59 .11 .3 .59 .11 .3 .59 .11’ -negate xray.jpg
Note: If anyone can figure out how to get the ImageMagick convert program to take the 5th column and/or 4th row values I would appreciate if you post the solution here.
Thanks,
Kevin
Works like a charm! Thanks you saved me alot of time. 🙂
Thanks !
sweet, thanks a lot for this!
I was wondering if it is possible to change the color of an image. What I want to be able to do is send a function RGB colors and then have it color the image. Tint sort of does that but changes the background and everything inside of the image. I want it to function like Hue but be able to send an RGB rather then a Hue percentage.
I can ColorMatrix Class in AS3 example of the source code it?
Thanks!
Good work! Cheers 🙂
Very simple and helping.
Thanks!
Hi,
superb class, really needed something exactly like this. Very nice work.
Thanks
Hmm… I found a BAD bug..
Zoom in several times. your color transform will break and go back to regular colors.
Hi, I’m a newbie to Flash but I really like this! I was wondering if anyone could help me understanding if I can add a .mid file or otherwise how can I make it work…Should I take from the zip file some .as file and work on that?What should I do to reseize the equalizer and add a mp3?I know it’s basic, but please, help with that, I’d appreciate it!
Totaly awesome class! Thanks a bunch!
Hi Grant,
Thanks for writing and sharing the ColorMatrix class, it is very useful. I have used it in a Flash based image editor.
My client has now asked me if they can have Levels (like there is in PhotoShop). Have you ever seen this done? Any thoughts on how I should go about it?
Cheers,
Adrian
Awesome! Exactly what I needed.
Thanks a lot,
Britta
Brilliant. Thank you very much.
I’m not worthy!
I’m not worthy!
Thanks! Just made my day!
Hi Grant,
Is it possible to print out an image that has had a colorMatrixFilter applied to it? I’m just getting the source image color every time. Any help would be greatly appreciated.
Wow, thanks. This is an awesome little class.
Thaks for the tutorial and the class. I like this..
I have tried this class and seems pretty good, although the results are a lot different than those in photoshop, fireworks etc. For example I have a red box, and try to make it yellow. That should normally be 60 hue, but all you get is a brownish yellow. Same goes for teal with 180 or -180 hue. Anyone knows why or how to fix that?
Good Job!!!!, very useful.
great class, saved my day thx gSkinner team!
It is really a great class, it help us easily operate color’s matrix.
But I found a issue about the class: adjustXX(value) functions expect a delta value, but not a absolute value, as you know, Flex Animate framework just pass the absolute value to the Filters.
Recently, I try to write a AdjustColorFilter instead of ColorMarixFilter. I use (lastSaveAbsolutHueValue – currentlyAbsoluteHueValue) to simulate the delta value, but after setting the filter’s repeat property, the deviation became more and more big.
At last I used fl.motion.AdjustColor resolve the issue.
If you are intersted in the AdjustColorFilter, you can refer http://www.smithfox.com/?e=64
Excellent one. Is there a way to work with sharpness adjustment.
Nice one, works perfectly. Thanks for sharing. 🙂