Lately we’ve been posting about new features coming in Degrafa Beta 3.2, but some of these have been in the development branch codebase for a while. One of those features is masks, which have been in the codebase in various forms since late last year and were extended to cover 4 main masking modes mid-year.

Some of the features of masks in Degrafa go beyond what is offered as regular masking support in the Flash Player. With masks in Degrafa you can define a shape via Degrafa MXML and mask another Degrafa object with a few interesting mask types:

svgMask – Luminosity+Alpha: Takes into account the color, alpha and shape of the mask shape to define the mask.

alpha – Uses the alpha of the mask shape to define the mask. This is equivalent to Flash Player native alpha masking

svgClip –  Uses the defined path of a shape of a mask shape to define the mask. Does not take into account things like strokes.

clip – this takes into account the filled region of the mask only to clip the maskee and is equivalent to the flash player native clipping mask

unMask – Removes any applied masks to show the mask fully rendered

You can see a simple example of Degrafa mask here. This feature will also be packaged as part of the Beta 3.2 release of Degrafa.

We will be introducing a couple more simple yet sophisticated decorations into Degrafa Beta 3.2 in order to show the multitude of ways this feature can be used. One of these is ShapeStrokeDecorator. This is a different type of decoration compared to the the SVGDashLine example in that in MXML it “wraps” the geometry you wish to decorate rather than being a nested tag. Consider the order of composition reversed between the two types.

ShapeStrokeDecorator achieves results similar to advanced path tools in a vector editor that allow placement of items along a path.

This decoration will be part of beta 3.2 due out this week. Here it is in action.

Greg Dove, a Degrafa core team member, and the creator of Degrafa’s VectorFill, has broken new ground with another new Degrafa paint object, VideoFill.

There have been a couple of sneak previews of VideoFill over the past few months; Juan showed a quick preview at 360|Flex earlier this year and Greg showed a quick demo at FlashCamp in New Zealand as recently as September. Well, no more ’sneaks’ (apart from this one!), it’s finally going to be available from beta 3.2.

You won’t believe all the things you can do with this, suffice to say that it makes some video effects that could be difficult to achieve – even in the Flash authoring tool – very easy to code in Flex with Degrafa.

To be honest, we don’t know what you will do with VideoFill. We can see it being used in creating custom players for specific video content or for specific vector/clipping effects for video -this is quite practical and quick to do with VideoFill. And yes…it can be used for skinning if absolutely required (’absolutely’? yeah we can’t think of when that would be either….but hey, we’ll let someone else tell you not to do it!).

A screen capture from the Avatar trailer being used as a VideoFill

Under the hood, to make VideoFill work, a complete new custom video player class was written from the ground up, designed for the purpose of supporting the way that VideoFill does its magic internally within Degrafa. VideoFill does require data access permission to work with the bitmapData of the video, but that is quite straightforward if you load from a domain under your control. It handles both progressive download video and also has support for rtmp streaming video content. Greg is also planning to add in support for the Camera object to round things out in terms of capabilities/support so that it’s easy to add live webcam content as a fill.

Back in the realm of regular paint classes in Degrafa, VideoFill is an ITransformablePaint object, which means you can spin, skew, scale and move a VideoFilll inside its target Geometry object using Degrafa’s Transforms…all while the video is happily playing! Watch out for more VideoFill information and tutorials after additional exciting beta 3.2 announcements in the coming days. We’ll add an official VideoFill sample to the Degrafa samples page as soon as beta 3.2 is released…for now you can whet your appetite on this one.

On Halloween Branden Hall and Joshua Davis released the HYPE framework into the wild. As they describe it, the Hype framework is:

… a creative coding framework built on top of ActionScript 3. A major goal of HYPE is to allow newcomers to Flash and ActionScript to creatively play and express themselves while they are learning how to program.

After seeing Joshua Davis give a talk at Adobe MAX I was excited to start playing around with the framework. Well, that and seeing how Degrafa AS3 and HYPE might work together.

Below is a basic example I put together that takes some of what Branden Hall walked through in a demo and some of what was demoed at 360|Flex Indy. The example uses one of Degrafa’s Gear AutoShapes, which is drawn to a MovieClip and manipulated with the HYPE framework.

As I have more time I’d like put together some more complex examples. In the mean time, if anyone else has an example of Degrafa + HYPE, we’d love to see it.

Download the Source