It is with great pleasure that I announce the release of GfxBuilder 0.2 and its companion griffon plugin. These are the relevant changes in this release

• Renamed GfxPanel to GfxCanvas. this class no longer extends JPanel, it is now a regular JComponent subclass.
• Caching of shape information was too aggressive, it hindered animations. This problem has been fixed.
• Added missing HSL properties to griffon.builder.gfx.Colors.
• Added a new node: rawNode. It grants you direct access to underlying graphics context.

I believe a demonstration of rawNode is in order. Let's revisit the Gfx+Trident animation, this time we would like to highlight the contour of the animated shape, along with its bounds. The following video shows the animation running:



As you can see (pause at 00:12 for a better look) there is a red rectangle that changes size as the shape scales and rotates itself. There is also a visible white border, which of course moves along with the shape. However there are two static outlines. The cyan outline matching the shape and the yellow rectangle that matches the former's bounds. Now let's look at the code
import groovy.swing.SwingBuilder import griffon.builder.trident.* import griffon.builder.gfx.* import griffon.builder.gfx.swing.* import groovy.beans.Bindable import org.pushingpixels.trident.Timeline.TimelineState @Bindable class Model { float s = 0.5f float ra = 0.0f } def model = new Model() def trident = new TridentBuilder() def anim = trident.timeline(model, duration: 3000, loop: 'reverse') { interpolatedProperty(property: "s", from: 0.5f, to: 2.0f) interpolatedProperty(property: "ra", from: 0f, to: 359f) } def cx = 200 def cy = 200 def radius = 50 def gfx = new GfxBuilder() def node = gfx.group(bc: 'none') { antialias true background(color: color("black")) group(id: "g1", sx: bind{model.s}, sy: bind{model.s}, ra: bind{model.ra}, mouseClicked: {anim.state == TimelineState.SUSPENDED? anim.resume() : anim.suspend()}) { rect(x: cx-radius, y: cy-radius, w: radius*2, h: radius*2, f: color('blue')) circle(cx: cx-radius, cy: cy-radius, r: radius/2, f: color('red')) circle(cx: cx-radius, cy: cy+radius, r: radius/2, f: color('green')) circle(cx: cx+radius, cy: cy-radius, r: radius/2, f: color('yellow')) circle(cx: cx+radius, cy: cy+radius, r: radius/2, f: color('violet')) } rawNode { g, component, bounds -> g.color = color('cyan') g.draw(g1.shape) g.color = color('yellow') g.draw(g1.shape.bounds) g.color = color('white') g.draw(g1.runtime.boundingShape) g.color = color('red') g.draw(g1.runtime.boundingShape.bounds) } } def swing = new SwingBuilder() swing.edt { frame(title: "GFX + Trident 2", size: [410,430], visible: true) { widget(new GfxCanvas(), id: "canvas", node: node) } } trident.swingRepaintTimeline(swing.canvas, loop: true)Decided to show the code as a regular standalone Groovy script, you can run it via the Groovy shell or the Groovy console, if all required libs and dependencies have been previously placed at ~/.groovy/lib. These are the main differences from the previous version:

• The main group sets 'none' as the border color, this means not outlines will be drawn unless explicitly told so.
• The background is set to black rather than white.
• The secondary group (the one that holds the actual shape) now has an id, it will become useful in the next step.
• A rawNode is used to draw the static and dynamic shapes related to the secondary group.

Notice that the static shape information can be accessed directly from the g1 group itself, while the dynamic (or runtime) shape information is accessed via a runtime property. All DrawableNodes have a runtime property, it's responsibility is to compute and cache runtime values related to their corresponding node. At the moment, rawNode is the only way to effectively peek at a node's runtime values and do something with them in the same rendering sequence.

Another advantage of rawNode is that you may be able to insert any Graphics related code directly into the rendering pipeline, say, like those Clojure powered fractals There is a catch however, rawNode is not a DrawableNode so it won't be able to contribute shape information to its surrounding parent (typically a group).

Feedback is always appreciated.

Keep on Groovying!