Tutorial 7 – Renderables

Renderables are special group of components that implement IRenderable interface. As the title suggests these components are able to render stuff onto Genome2D context and expose the render method. There can be just a single IRenderable component on a node at a single time.

Each renderable component has to implement these things:

// Which is called in Genome2D render cycle for each camera
render(p_camera:GContextCamera, p_useMatrix:Bool):Void;

// Is used to calculate bounds of a node
getBounds(p_target:GRectangle = null):GRectangle

Basic renderable components that everyone will encounter are GSprite and GMovieClip which are used to render static and animated graphics where both extend GTextureQuad component.


Is a component that handles rendering of a single texture and doesn’t change in time.

// Create a node with GSprite component and return the instance of GSprite
var sprite:GSprite = GNodeFactory.createNodeWithComponent(GSprite) as GSprite;
// Assign a texture to the sprite instance by the texture ID
sprite.textureId = "someTextureId";
// The above line can be also written like this by assigning texture directly
sprite.texture = GTextureManager.getTextureById("someTextureId");


Is a component that handles rendering of animations, it changes textures based on frames and speed defined.

// Create a node with GMovieClip component and return the instance of GMovieClip
var clip:GMovieClip = GNodeFactory.createNodeWithComponent(GMovieClip) as GMovieClip
// Assign frame texture ids which specify the animation
clip.frameTextureIds = ["someTextureId1", "someTextureId2", "someTextureId3", "someTextureId4"];
// Set the frame rate the textures should change
clip.frameRate = 30;
// Set the movieclip to repeat from start once it ends
clip.repeatable = true;

GMovieClip also exposes few other helpful functions.

//Go to a specified frame and stop
//Go to a specified frame and play
//Go to a specified frame, doesn't change playback state
//Start playing
//Stop playing