Way to handle colors visually/manually AND with code, in Flash/Animate?

Question

I used to use a lot of Filters in Animate, and it was glorious because I could make a color filter by hand, see what it looks like, and then integrate code into that too, eg:

object.filters = e.currentTarget.filters;

But I'm trying to be good and stay away from filters to reduce processing power etc. Plus, filters don't take in hex codes. So I'm trying to use colorTransforms. But now things get really unwieldly because I figure out which colors I want, write down all the hex codes in Notepad, then write code to transform things to that color. And I still can't SEE the colours interacting until I publish the file. Isn't there SOME way to manually fiddle with colorTransforms? Maybe the Advanced section under Color Effect -> Style?

How I imagine this happening in my fantasy is: I have a few movieclips which interact to create a fabric swatch. I fiddle with the colorTransform or SOMEhow apply a hex code to them manually (not dynamically in code), and then I can use those swatches to dynamically color other things, something like:

newFabric.topPattern.colorTransform.color = fabricSwatch.topPattern.colorTransform.color;

I know I can do this if I added the colour using code first.. but is there any way to add the colour on the stage/visually/manually and then have the code roll it forward? I know I can draw a bitmap and sample a pixel's color, but the patterns all have very fine, different & complex shapes and transparencies so that won't work here :/

Answer 1

There are LOTS of tutorials out there for using colortransforms – like this one .

As for using hex colors, you can convert back and forth between the various color representations very easily. A simple Google search turned up this snippet :

var brightPinkHex:uint = 0xFF32CC;
var brightPinkRGB:Object = HexToRGB(brightPinkHex);
trace(brightPinkRGB.r+ ", " + brightPinkRGB.g + ", " + brightPinkRGB.b);

function HexToRGB(value:uint):Object {  
    var rgb:Object = new Object();
    rgb.r = (value >> 16) & 0xFF
    rgb.g = (value >> 8) & 0xFF
    rgb.b = value & 0xFF            
    return rgb;
}

// OUTPUT
// 255, 50, 204

Answer 2

Ok! I have found a workaround! \\o/

I can edit the Tint manually, and even input a hex code or eye-drop a colour from my pre-made palette. I just have to make sure to set the "Tint" setting on the Tint to 100%. (Color Effect -> Style:Tint)

Now I simply use the colorTransform code and it can pull my manually placed Tint, and transfer it to other items:

grl.overlay.shapes.transform.colorTransform = e.currentTarget.shapes.transform.colorTransform;

I didn't even have to change my code AND this is better than filters since I can input hex codes. I don't know how this will be on performance relative to filters, but someone just told me that it shouldn't be too bad since nothing is animating. I'm so happy :)