2D Nodes
2D Toolbox
The Toolbox for 2D scenes provides the following items:
-
A "Show Controls as Big Icons/List" button is available in the upper right corner. If this button is used, a different presentation mode - as icons instead of a text list of items - will be made available (see the image below).
Create 2D Nodes
Following items can be used to create a new node in the scene graph:
|
|
2D Camera: To be linked to a render target, where the render result of the camera will be drawn. Candera::Camera2D |
|
|
2D Group: Parent item for other nodes. Child nodes are located relative to the parent group. Candera::Group2D |
|
|
Base Line Layout: Provides a stacked layout in the horizontal direction. Candera::BaseLineLayouter |
|
|
Dock Layout: Provides an area divided into five screens (Top, Bottom, Center, Left, Right). Nodes can be placed in the screens surrounding the Center screen. Candera::DockPanelLayouter |
|
|
Grid Layout: Each node within the group will be positioned within a grid. Candera::DockPanelLayouter |
|
|
Overlay Layout: Allow you to place nodes on top of each other to create a layered effect. Candera::OverlayLayouter |
|
|
Stack Layout: Stacks nodes in the horizontal or vertical direction. Candera::StackLayouter |
|
|
RenderNode: Can be associated with any type of effect. Candera::RenderNode |
|
|
BitmapNode: By default associated with a BitmapBrushAlphaBlend effect. Candera::BitmapBrushAlphaBlend |
|
|
TextNode: By default associated to a TextBrushAlphaBlend effect. Candera::TextBrushAlphaBlend |
|
|
Solid Color: By default associated to a TextBrushAlphaBlend effect. Candera::SolidColorBrush |
For each of these types, refer to the Properties panel for inspecting all properties specific for the type of node. Tooltips are available to explain the purpose of the property. Refer also to the Properties Overview listing the Tooltip descriptions.
About MVG nodes, please refer to MVG Nodes page.
Position of 2D Nodes
By using the so-called "Object Inspector" feature, it is possible to display the following properties of a 2D node: Position, Scale, Rotation and BoundingBox. This can be done by right-clicking on a 2D node and selecting the "Object Inspector" from the context menu.
The displayed data (visible in the "Object Inspector" panel) is always refreshed reflecting all the changes made by the user.
WorldPivotPosition, WorldPosition and WorldBoundingBox can also be displayed in the Scene Editor panel.
This feature is disabled by default and can be enabled in "Preferences" > "Editor" > "2D" > "World Transformations". Alternatively, it can be enabled in "View" > "2D Editing Utilities" > "World Transformations".
Adding Text to the 2D Scenes
Text can be added to the scenes either by using a dedicated node called TextNode2D or by using a Render Node in conjunction with a text effect.
TextNode2D
The image below shows how to drag and drop the TextNode2D from the Toolbox to the scene tree:
The TextNode2D default properties are set so that the node is displayed after it is added to the scene tree.
-
Please consult Text Style Palette for detailed information about adding and editing styles.
Render Node
Adding the Render Node to the scene tree is done in a similar way but using the corresponding icon:
The Render Node is meant to be used with any kind of effect so, after adding the node to the scene tree, implicitly, the Effects list is empty and there is no visual outcome in the Scene Editor.
Drag and drop a text effect into the node Effect list and then configure its Style (see Text Style Palette) and Text properties:
Solution Conversion from TextEffects to TextNode2D
A new option "Replace Old Text Nodes" was added in the context menu for all scenes, controls and folders containing scenes or controls. This will enable the user to replace the TextNode-TextBrushEffect pairs with the new TextNode2D-BitmapBrushBlendEffect pairs.
The user can perform the conversion by selecting from the Context menu the "Replace Old Text Nodes" item, available on 2D Scenes, 2D controls and folders which contain at least one of the previous.
A "Conversion to Text Node" dialogue shows the output path and provides a "Suggest widget for deletion after conversion" checkbox.
The converter will iterate through all 2D scenes and 2D controls and convert the RenderNode items having TextBrushBlendEffect or TextBrushColorBlendEffect effects. Each RenderNode having a TextBrushBlendEffect/TextBrushColorBlendEffect will be replaced by a TextNode2D having a BitmapBrushColorBlend effect.
The properties of the new TextNode2D will be copied in the following order:
- From the widget attached to the node
- From the effect associated to the old node
- From the common properties of the old node
Source render nodes or text effects can be animated. Animated properties will be exchanged with destination properties. The only eligible property is TextBrushBlend.TextColor. Attached widgets can also be animated. If there is an animation on a property that is part of the conversion, the animated property shall be exchanged with the destination property (for example TextEffectWidget.TextColor).
A specific category called "Text Layout" includes the following properties: TextAlignment, LineSpacing, Trimming, MultiLine and WordWrap.
All the properties from this category are visible only if Enable Text Layout is checked. If it is unchecked, the default values of the properties will determine in which way the text is rendered.