One of the big features we've added recently to Construct 3 is the Scene Graph or Hierarchies feature. You can do all sorts with the Scene Graph, including animations, boss battles and more, but let's start at the beginning…
So what is it?
The term Scene graph is a fancy name for a tree structure or a hierarchy, in which a root parent object can have children. Those children can then have children of their own and so on – think of a Family Tree.
The structure can look something like this:
In the context of Construct, this feature allows you to establish that kind of relationship between plugin instances – so a Sprite object could have several Sprite children, or a combination of different object types like 3D objects, Spritefonts and Tiled Backgrounds.
Once you've built a hierarchy, it's possible for the runtime to then calculate translations, rotations and scaling of a child based on that of its parent. For example, if you moved the parent 100 pixels to the left, all the associated child objects would also move to ensure they maintained their position relative to the parent's origin.
You can see this in action in the Skeleton Hierarchy example included in C3:
As the parents in the hierarchy move, the rest of the skeleton animates along with it!
How can I create a Hierarchy?
You can either set up your hierarchies at runtime or within the editor. If you're planning on setting up the hierarchy at runtime, you'll need to use the Add child and Remove child actions. There's also the Remove child from parent action if you want to apply the action to a child object.
If you're creating the hierarchy in the editor, select the objects you want to add to the hierarchy. Then right-click on the object that you want to be the parent to open the menu. You should be able to see the Hierarchy menu and you can then begin adding children.
You can also select all current children or remove children from a parent with this menu once you've got the hierarchy set up.
If you want to keep an eye on how your hierarchy is building, you can opt to have the editor show you the structure of the hierarchy. If you enable 'Show hierarchy' in a layout's properties, green arrows will be displayed to show your hierarchies. The arrows run from parents to children and give you a visual cue as to how the hierarchy is operating.
You'll also find a new section in the Properties Bar. If you have a child object selected, you can choose which properties the child transforms with and whether the child destroys with the parent.
If you've set up a hierarchy in the editor, and need a second one at runtime (perhaps a second of a particular kind of enemy spawns later) then you can also create copies of your hierarchy at runtime! Once the hierarchy is set up in the editor, when you create an object using the System 'Create object' action, you can tick the 'Create hierarchy' checkbox. Then, when you create the parent object, the whole hierarchy will be created too!
What can I do with this?
There are several examples on the Construct 3 Start Page that demonstrate the Scene Graph feature in action.
The Basic Hierarchy template shows how to use the Add Child action to connect objects and shows them moving and rotating together.
The aforementioned Skeleton Hierarchy takes this a step further, creating a more complex hierarchy at runtime using the Add Child action. Each piece connects to form a skeleton and then different values are tweened to show the whole hierarchy moving and changing together.
For a more in-depth example that showcases how you can use the Scene Graph feature alongside other features like Timelines, take a look at the Segmented Boss Fight example (you'll need to be using r254+ though). The guys at Viridino Studios have done a cracking job laying out the example and it uses a hierarchy to put the Boss together and timelines to handle its animations.
There has been plenty of cool stuff created using the Scene Graph feature already, so if you've not tried it out, why not give it a go?