Drop shadow from Actionscript

37 views
Skip to first unread message

Cliff

unread,
Nov 24, 2009, 3:06:33 PM11/24/09
to Degrafa
First, I love Degrafa, it has really solved a number of my problems.

I only use degrafa from actionscript, so many of the examples don't
help. I am drawing bezier lines, and was wondering if there is is an
easy way to draw a drop shadow under the line from actionscript only.
My sample code looks like this:

bez = new CubicBezier(xStart,yStart,xC1,yC1,xC2,yC2,xEnd,yEnd);
bez.stroke = solidStroke;
bez.draw(graphics,null);

It works great, I just want to draw a shadow under it.

Any hints?

gwd

unread,
Nov 28, 2009, 6:23:21 PM11/28/09
to Degrafa

Hi, is the cubic bezier the only thing you are drawing to the
displayobject that has the graphics target?

if so you can put the filter on the target

filters=[new flash.filters.DropShadowFilter()];


otherwise you could just try using a filter on your bezier curve
geometry:

bez.filters=[new flash.filters.DropShadowFilter()]
bez.draw(graphics,null);

either of these approaches generates a rasterized version of the
bezier with the dropshadow, and may not work so well if you go over
2880 pixels wide or high. For the native flash filter, this will mean
the filter will just drop out, for degrafa I can't recall if there is
an error or not. Also, if you use this approach with degrafa and have
an increased scale on the target displayobject, pixelation will likely
be noticeable.


(configure the filter arguments for the dropshadow as you would
normally do)

regards
Greg

Cliff

unread,
Nov 29, 2009, 2:35:31 AM11/29/09
to Degrafa
thanks very much. It works both ways. I must have been asleep at the
wheel originally, because I had already tried (essentially):

bez.filters=[new flash.filters.DropShadowFilter()]

except I put it AFTER:

bez.draw(graphics,null);

which didn't really help matters. So then I assumed maybe there was
something special about degrafa that required a different approach to
drop shadows when the whole time it was that I was trying to apply it
after it was already drawn.

Putting the order right solved it, but it does slow it down
noticeably. Is there any other way to do a drop shadow so that I
don't get a rasterized version? I do think I will run into the 2880
pixel limitation and scaling issue, as even my app does both zoom and
works with large canvases.

Thanks,

gwd

unread,
Nov 29, 2009, 2:49:37 PM11/29/09
to Degrafa
Hi,

If you have the choice of using both approaches, and there are not
other considerations that influence your choice, then its better to go
with the native display object based filters for performance. Degrafa
filters are great for compositing geometries together but there is a
higher overhead with using them.

The same of course is true in the player itself compared with not
using filters, but they should be faster than using the degrafa ones
if you're updating the bezier a lot.

Using filters in Degrafa *or* the flash native filters means
a) you use extra memory because extra bitmapdata is created
b) things run slower becaue at a low level a filter is basically
looping through all the pixels for each change of the filtered
object's display state.
So this means that for larger shapes, the filters cause more slowdown
(part of the reason for the size limits in flash I guess).

One way around this is the old flash trick that pre-dates the
availability of filters in flash: drawing a vector 'shadow' version of
your cubic bezier. It won't be as blurry but I think you could do
something like that by displacing each of the points by the half the
length of the dropshadow in the direction of the angle (simple
trigonometry), setting this version's stroke color to (eg.) black with
a low alpha and stroke weight to be the length of the shadow. Draw the
'shadow' version before you draw the original. Play with the settings
to get the best effect. It won't be as 'nice' looking as the filter
version, but should be fast.


Hope that helps
Greg

Mihai Catan

unread,
Feb 27, 2010, 4:30:55 AM2/27/10
to deg...@googlegroups.com
Hi,

Try this:

var dropShadow:DropShadowFilter = new DropShadowFilter();

bez.filters = [dropShadow];

Mihai

> --
>
> You received this message because you are subscribed to the Google Groups "Degrafa" group.
> To post to this group, send email to deg...@googlegroups.com.
> To unsubscribe from this group, send email to degrafa+u...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/degrafa?hl=en.
>
>
>
>

Reply all
Reply to author
Forward
0 new messages