Search code examples
apache-flexactionscript-3

Flex - weird display behavior on large number of Canvas


I have a Flex app (SDK 3.5 - FP10) that does mindmap trees. Every node is a Canvas (I'm using Canvas specific properties so I needed it). It has a shadow effect, background color and some small ui element on it (like icons, texts...). It works perfectly until it goes over ~700 nodes (Canvas). Over that number it shows grey rectangles. If I turn off the DropShadowFilter effect for the Canvas, they are also gone, so I assume it's a DropShadowFilter problem.

The effect is simple:

private static var _nodeDropShadow:DropShadowFilter = new DropShadowFilter(1, 45, 0x888888, 1, 1, 1);

_backgroundComp.filters = _nodeDropShadow;

Is it possible that Flex can't handle that much?


Solution

  • I think you're exactly right, flex can't handle that many drop shadow filters. They're very expensive. However, if you're using the built in skins, they create bitmap versions of the dropshadows that are less processor intensive. You'll want to set the style "dropShadowEnabled" to true to enable this effect. You'll have less control over this type of dropShadow, but you may be able to get it to do what you want.

    For more dropshadow styles, read the style list of mx:Canvas here: http://livedocs.adobe.com/flex/3/langref/mx/containers/Canvas.html