TweenLite/TweenMax support for ConvolutionFilter

Question

I am applying filters to a bitmap using something like:

TweenLite.to(origBitmap,0,{colorMatrixFilter:{saturation:2,brightness:3});

and that works fine.

I need to somehow apply a sharpen filter to origBitmap which I have successfully achieved using a ConvolutionFilter. The problem is after I've ran the above tweenlite call, then create a convolution filter and apply it to origBitmap, it removes the initial saturation and brightness filters and just keeps the sharpen filter

private function applyEffects(effects:Array):void
{
  currentEffects = effects;
  var props:Object = {};
  for (var i:String in effects)
  {
    props[effects[i].effect] = effects[i].amount;
  }
  TweenLite.to(bitmap,0,{colorMatrixFilter:props});
  //-- props could look like {saturation:2,brightness:3}


  //-- This will sharpen the container sprite
  var matrix:Array = [0, -1,  0,
                     -1,  5, -1,
                      0, -1,  0];
  var conv:ConvolutionFilter = new ConvolutionFilter();
  conv.matrixX = 3;
  conv.matrixY = 3;
  conv.matrix = matrix;
  conv.divisor = 1; 
  bitmap.filters = [conv]; //-- this removes the above filters and just sharpens the image
}

Is there a way to also incorporate the ConvolutionFilter in that TweenLite call above? I've searched quite a bit and found some guy made a class called TweenMan which was based around your class where ConvolutionFilter is incorporated: https://github.com/danro/tweenman-as3

Answer 1

Nothing to do with TweenMax here since your code is the one making the mistake. This correctly removes all current filter and apply only one:

bitmap.filters = [conv];

Since filters property is either null or is an Array. To add a filter to the list you use array operation and reapply the array:

var filters:Array = bitmap.filters;
if(!filters)
{
    filters = [];
}
filters.push(conv);
bitmap.filters = filters;

EDIT: starting over since I think I understand what you are trying to do. You are avoiding creating the filter yourself and let TwennLite do it for you even tough you don't need to tween anything. Don't do that, you are making everything harder for yourself. Instead create your filter that way:

var props:Object = {};
var colorMatrix:ColorMatrixFilter = new ColorMatrixFilter();
for (var i:String in effects)
{
    colorMatrix[effects[i].effect] = effects[i].amount;
}
bitmap.filters = [colorMatrix];
//etc .... then
var filters:Array = bitmap.filters;
filters.push(conv);
bitmap.filters = filters;

If you need to animate multiple filters remember that most tween engine can tween easily array values so you can just do that and then apply those array values to your filters.