Here you can find the reference for using JavaScript scripts in your Kanzi applications. You can use scripts after you add the Execute Script action to any trigger in your nodes. See Using scripts and Triggers.
Kanzi uses Google's V8 JavaScript engine.
In your Kanzi Studio project scripts are stored in the Library > Resource Files > Scripts, and on the hard drive in the <ProjectName>/Scripts directory. You can write and edit scripts in the Kanzi Studio Script Editor, or in any other text editor.
Action | Description | Shortcut |
---|---|---|
Save | Saves the currently open script. | Ctrl S |
Comment selection | Comments the currently selected lines of code. | Ctrl K Ctrl C |
Uncomment selection | Uncomments the currently selected and commented lines of code. | Ctrl K Ctrl U |
You can use these functions and methods in your scripts.
In your Kanzi applications you can use the standard JavaScript API. For example, you can use:
var d = new Date(); print('Date: ' + d.toString()); print('Milliseconds since 1970: ' + d.getTime()); print('Year: ' + d.getFullYear()); print('Month: ' + (d.getMonth() + 1)); print('Day of the month: ' + d.getDate()); var minutes = String(d.getMinutes()).length < 2 ? '0' + d.getMinutes() : d.getMinutes(); var seconds = String(d.getSeconds()).length < 2 ? '0' + d.getSeconds() : d.getSeconds(); print('Time: ' + d.getHours() + ':' + minutes + ':' + seconds);
print('random number in [0, 1]: ' + Math.random()); print('pi: ' + Math.PI); print('sqrt(3): ' + Math.sqrt(3)); print('pow(3, 3): ' + Math.pow(3, 3)); print('sin(PI / 2): ' + Math.sin(Math.PI / 2)); print('cos(PI): ' + Math.cos(Math.PI)); print('round(4.2): ' + Math.round(4.2));
var text = 'Kanzi Rules!'; print('The position of "!": ' + text.search(/!/)); print('Has "Kanzi": ' + /Kanzi/.test(text)); print('Replace: ' + text.replace(/Kanzi/, "Kanzi 3"));
Creates a node.
Syntax | instantiateNode('type.node', 'name')
|
||||||
Parameters |
|
||||||
Examples | // Finds the Scene node using an alias named Scene. var scene = node.lookupNode('#Scene'); // Creates a Flow Layout 3D node. var flowLayout = instantiateNode('Kanzi.FlowLayout3D', 'NewFlowLayout'); // Adds the Flow Layout 3D node to the Scene node. scene.addChild(flowLayout); |
Instantiates a prefab.
Syntax | instantiatePrefab('prefab', 'name')
|
||||
Parameters |
|
||||
Examples | // Instantiates a prefab PrefabName as a child of the node from which the Execute Script action is triggered.
// node is a global variable and resolves to this node.
var prefab = instantiatePrefab('kzb://<project_name>/Prefabs/PrefabName', 'NewItem');
node.addChild(prefab);
|
Finds and returns a node in the scene graph.
Syntax | lookupNode('node')
|
||
Parameters |
|
||
Returns | the node. If lookupNode cannot find the node, it returns null. |
||
Examples | // Finds the node to which the alias named Item points. var item = node.lookupNode('#Item'); // Finds the node Text Block 3D, which is relative to the // node on which you call the method. var textBlock3D = node.lookupNode('Text Block 3D');
// Prints the value of the Name property of the current node.
// node is a global variable and resolves to this node.
print(node.Name);
|
Prints to the Log window.
Syntax | print('content')
|
||
Parameters |
|
||
Examples | // Prints Hello world! to the Log window
print('Hello world!') // Finds the node Grid List Box 3D called Grid List Box 3D. var gridListBox = node.lookupNode('Grid List Box 3D'); // Prints to the Log window the number of items in the Grid List Box 3D. print(gridListBox.getItemCount()); |
Sets the value of a property. If the node does not have the property you are setting, Kanzi adds that property. Use setProperty
to set material and attached properties, such as layout properties. You can set all other properties using the Kanzi Engine property name after calling the node.
You can see the Kanzi Engine property name when in Kanzi Studio you hover your mouse pointer over a property name.
See getProperty, removeLocalValue, and Color properties.
Syntax | setProperty('property', 'value')
|
||||
Parameters |
|
||||
Examples | // Finds a mesh named Plane and sets its Texture property to // the texture located in Textures/Texture01. var plane = node.lookupNode('Plane'); plane.setProperty('Texture', 'kzb://<project_name>/Textures/Texture01'); // Finds the node to which the TextBlock alias points, // and sets the value of the Text property in that node to Menu. var textBlock = node.lookupNode('#TextBlock'); textBlock.Text = 'Menu'; // Sets the Name property of the node to NewName. textBlock.Name = 'NewName'; |
Returns the value of a property. You can get properties using the Kanzi Engine property name after calling a node.
You can see the Kanzi Engine property name when in Kanzi Studio you hover your mouse pointer over a property name.
See setProperty, removeLocalValue, and Color properties.
Syntax | getProperty('property')
|
||
Parameters |
|
||
Returns | the value of the property | ||
Examples | // Finds the node to which the TextBlock alias points, // gets the value of the Text property in that node, // and prints it to the Log window. var textBlock = node.lookupNode('#TextBlock'); var text = textBlock.getProperty('TextBlockConcept.Text'); print(text); // Finds the Image1 and Image2 nodes using a relative path // from the node where you execute this script. var image1 = node.lookupNode('../Image1'); var image2 = node.lookupNode('../Image2'); // Sets the value of the Layout Width property in the Image1 // node to the Layout Height property in the Image2 node. image2.Height = image1.Width; // Finds the RootPage node using a relative path from // the node where you execute this script. var rootPage = node.lookupNode('../../RootPage'); // If in the RootPage node the Default Subpage property is set, // prints to the Log window the relative path to that node. if (rootPage.DefaultSubPage) { print(rootPage.DefaultSubPage); } else { print("The Default Subpage property is not set!"); } |
Delete a property from a node.
You can see the Kanzi Engine property name when in Kanzi Studio you hover your mouse pointer over a property name.
See setProperty, getProperty, and Color properties.
Syntax | removeLocalValue('property')
|
||
Parameters |
|
||
Examples | // Finds the node to which the TextBlock alias points
// and removes the Text property from that node.
var textBlock = node.lookupNode('#TextBlock');
var text = textBlock.removeLocalValue('TextBlockConcept.Text');
|
Set the values of color properties using an array.
See getProperty, setProperty, and removeLocalValue.
Syntax | [r, g, b, a]
|
||||||||
Parameters |
|
||||||||
Examples | // Finds the node to which Point Light alias points
// and sets the Point Light Color property of that node to green.
var light = node.lookupNode('#Point Light');
light.setProperty('PointLightColor.Color', [0, 1, 0, 0]); // You can set the color of the Color Brush property for a node only // when that node has the Foreground Brush or Background Brush property // set to a Color Brush. // Finds the node to which Button alias points, // overrides the color set in a Color Brush in the Foreground Brush and Background Brush properties, // and sets the color of the Color Brush property of the node to red and opaque. var button = node.lookupNode('#Button'); button.setProperty('ColorBrush.Color', [1, 0, 0, 1]); |
All nodes can have child nodes, except list box nodes (Trajectory List Box 3D, Grid List Box 3D, Grid List Box 2D) that have items. See Items.
Adds a child node to a node.
Syntax | addChild(node)
|
||
Parameters |
|
||
Examples | // Instantiates a prefab called Sphere and names it NewSphere.
var sphere = instantiatePrefab('kzb://<project_name>/Prefabs/Sphere', 'NewSphere');
// Finds the Empty Node 3D node called Empty Node 3D.
var emptyNode = node.lookupNode('Empty Node 3D');
// Adds the NewSphere node to the Empty Node 3D node.
emptyNode.addChild(sphere);
|
Gets a child node of a node.
Syntax | getChild()
|
Examples |
// Finds the Empty Node 3D node called Empty Node 3D.
var emptyNode = node.lookupNode('Empty Node 3D');
// Gets the second child of the emptyNode node.
emptyNode.getChild(1);
|
Gets the number of child nodes of a node.
Syntax | getChildCount()
|
Examples |
// Finds the Empty Node 3D node called Empty Node 3D.
var emptyNode = node.lookupNode('Empty Node 3D');
// Gets the number of child nodes of the emptyNode.
emptyNode.getChildCount();
|
Removes a child node from a node.
Syntax | removeChild(node)
|
||
Parameters |
|
||
Examples | // Instantiates a prefab called Sphere and names it NewSphere.
var sphere = instantiatePrefab('kzb://<project_name>/Prefabs/Sphere', 'NewSphere');
// Finds the Empty Node 3D node called Empty Node 3D.
var emptyNode = node.lookupNode('./Empty Node 3D');
// Adds the NewSphere node to the Empty Node 3D node.
emptyNode.addChild(sphere);
// Removes the NewSphere node from the Empty Node 3D node.
emptyNode.removeChild(sphere);
|
Removes all child nodes from a node.
Syntax | removeAllChildren()
|
Examples | // Finds the node to which EmptyNode alias points. var emptyNode = node.lookupNode('#EmptyNode'); // Removes all child nodes from the emptyNode node. emptyNode.removeAllChildren(); |
Gets the parent node of the current node.
Syntax | getParent()
|
Examples | // Gets the parent of the current node. // node is a global variable and resolves to this node. var parentNode = node.getParent(); // Gets the parent of the current node. var nodeParent = node.lookupNode('..'); |
You can add items to controls that inherit from item collection. These controls are all list box nodes (Trajectory List Box 3D, Grid List Box 3D, Grid List Box 2D). See API reference.
All other nodes have child nodes. See Child nodes.
Adds an item to a node.
Syntax | addItem(node)
|
||
Parameters |
|
||
Examples | // Instantiates a prefab called Text Block 3D and names it NewText.
var text = instantiatePrefab('kzb://<project_name>/Prefabs/Text Block 3D', 'NewText');
// Finds the Grid List Box 3D node called Grid List Box 3D.
var gridListBox = node.lookupNode('Grid List Box 3D');
// Adds the NewText node to the Grid List Box 3D node.
gridListBox.addItem(text);
|
Gets an item from its host.
Syntax | getItem(index)
|
||
Parameters |
|
||
Returns | the item | ||
Examples |
// Finds the Grid List Box 3D node called Grid List Box 3D.
var gridListBox = node.lookupNode('Grid List Box 3D');
// Gets the second item of the gridListBox.
gridListBox.getItem(1);
|
Gets the number of items that belong to a node.
Syntax | getItemCount()
|
Returns | the number of items in the node the method is called on |
Examples | // Finds the Grid List Box 3D node called Grid List Box 3D. var gridListBox = node.lookupNode('Grid List Box 3D'); // Prints to the Log window the number of items in the Grid List Box 3D. print(gridListBox.getItemCount()); |
Removes all items from a node.
Syntax | removeAllItems()
|
Examples |
// Finds the Grid List Box 3D node called Grid List Box 3D.
var gridListBox = node.lookupNode('Grid List Box 3D');
// Removes all items from the Grid List Box 3D node.
gridListBox.removeAllItems();
|
Removes an item from a node.
Syntax | removeItem(node)
|
||
Parameters |
|
||
Examples | // Instantiates a prefab called Text Block 3D and names it NewText.
var text = instantiatePrefab('kzb://<project_name>/Prefabs/Text Block 3D', 'NewText');
// Finds the Grid List Box 3D node called Grid List Box 3D.
var gridListBox = node.lookupNode('Grid List Box 3D');
// Adds NewText node to the Grid List Box 3D node.
gridListBox.addItem(text);
// Removes NewText node from the Grid List Box 3D node.
gridListBox.removeItem(text);
|
You can set focus to nodes and move focus in the focus chain. Focus chain is a sequence of nodes which defines the order in which Kanzi sets focus to those nodes. See Focus and Using focus.
Gets the node that currently has focus.
See trySetFocus.
Syntax | getFocusedNode()
|
Returns | the node that has focus. |
Examples | // Gets the node that currently has focus. var nodeInFocus = getFocusedNode(); // Prints to the Log window the Name of the node. print(nodeInFocus.Name); |
Sets focus to a node. For example, use trySetFocus
to set the focus on a specific node in a project so that it can receive input from the keyboard. See Using triggers and Keyboard input codes reference, and getFocusedNode.
Syntax | trySetFocus()
|
Examples | // Finds the node to which the Button alias points. var buttonNode = node.lookupNode('#Button'); // Sets the focus to the buttonNode node. buttonNode.trySetFocus(); |
Moves the focus from the currently focused node to the next node in the focus chain in the forward direction. Kanzi automatically includes in the focus chain all nodes in your project. By default the focus chain moves the active focus from each node to the next child node. The forward direction chain uses the pre-order traversal of the node hierarchy. If the next node is a focus scope, the first focusable node in within that scope receives focus.
See tryMoveActiveFocusBackward, tryMoveActiveFocusUpward, tryMoveActiveFocusDownward, tryMoveActiveFocusLeft, and tryMoveActiveFocusRight.
Syntax | tryMoveActiveFocusForward()
|
Examples | // Moves the focus from the currently focused node to the next child node that has the Focusable property enabled. // If there is no child node, moves the focus down in the project tree to the next node that has the Focusable property enabled. tryMoveActiveFocusForward(); |
Moves the focus from the currently focused node to the next node in the focus chain in the backward direction. Kanzi automatically includes in the focus chain all nodes in your project. The backward direction chain uses reverse pre-order traversal of the node hierarchy. If the next node is a focus scope, the first focusable node in within that scope receives focus.
See tryMoveActiveFocusForward, tryMoveActiveFocusUpward, tryMoveActiveFocusDownward, tryMoveActiveFocusLeft, and tryMoveActiveFocusRight.
Syntax | tryMoveActiveFocusBackward()
|
Examples | // Moves the focus from the currently focused node to the previous child or parent node which has the Focusable property enabled. // If there is no child or parent node, moves the focus up in the project tree to the next node that has the Focusable property enabled. tryMoveActiveFocusBackward(); |
Moves the focus from the currently focused node to the next node in the upward direction based on the rendered position of that node. Use the Focusable property enabled.
property to set the relative path to the node which you want to receive focus. To receive focus, nodes must have theSee tryMoveActiveFocusForward, tryMoveActiveFocusBackward, tryMoveActiveFocusDownward, tryMoveActiveFocusLeft, and tryMoveActiveFocusRight.
Syntax | tryMoveActiveFocusUpward()
|
Examples | // Moves the focus from the currently focused node to the node specified in the //property. |
Moves the focus from the currently focused node to the next node in the downward direction based on the rendered position of that node. Use the Focusable property enabled.
property to set the relative path to the node which you want to receive focus. To receive focus, nodes must have theSee tryMoveActiveFocusForward, tryMoveActiveFocusBackward, tryMoveActiveFocusUpward, tryMoveActiveFocusLeft, and tryMoveActiveFocusRight.
Syntax | tryMoveActiveFocusDownward()
|
Examples | // Moves the focus from the currently focused node to the node specified in the |
Moves the focus from the currently focused node to the next node to the left based on the rendered position of that node. Use the Focusable property enabled.
property to set the relative path to the node which you want to receive focus. To receive focus, nodes must have theSee tryMoveActiveFocusForward, tryMoveActiveFocusBackward, tryMoveActiveFocusUpward, tryMoveActiveFocusDownward, and tryMoveActiveFocusRight.
Syntax | tryMoveActiveFocusLeft()
|
Examples | // Moves the focus from the currently focused node to the node specified in the |
Moves the focus from the currently focused node to the next node to the right based on the rendered position of that node. Use the Focusable property enabled.
property to set the relative path to the node which you want to receive focus. To receive focus, nodes must have theSee tryMoveActiveFocusForward, tryMoveActiveFocusBackward, tryMoveActiveFocusUpward, tryMoveActiveFocusDownward, and tryMoveActiveFocusLeft.
Syntax | tryMoveActiveFocusRight()
|
Examples | // Moves the focus from the currently focused node to the node specified in the |
Use the Page and Page Host nodes functions to navigate between the Page and Page Host nodes in your application.
Navigates to the Page or Page Host node.
Syntax | navigateToThisPage()
|
Examples | // Finds the node to which the alias points. The alias can point to either a Page or a Page Host node. var settingsPageHost = node.lookupNode('#SettingsPageHost'); // Navigates to the settingsPageHost node. settingsPageHost.navigateToThisPage(); |
Navigates to the next child Page or Page Host node of a Page Host node.
Syntax | navigateToNextPage()
|
Examples | // Finds the Page Host node to which the alias points. var applicationsPageHost = node.lookupNode('#ApplicationsPageHost'); // Navigates to the next Page or Page Host child node of the applicationsPageHost node. applicationsPageHost.navigateToNextPage(); |
Navigates to the previous child Page or Page Host node of a Page Host node.
Syntax | navigateToPreviousPage()
|
Examples | // Finds the Page Host node to which the alias points. var applicationsPageHost = node.lookupNode('#ApplicationsPageHost'); // Navigates to the previous Page or Page Host child node of the applicationsPageHost node. applicationsPageHost.navigateToPreviousPage(); |
Navigates to the parent Page or Page Host node of a Page or Page Host node.
Syntax | navigateToParentPage()
|
Examples | // Navigates to the parent Page or Page Host node of the current node. node.navigateToParentPage(); // Finds the node to which the alias points. The alias can point to either a Page or a Page Host node. var mediaPage = node.lookupNode('#MediaPage'); // Navigates to the parent Page or Page Host node of the mediaPage node. mediaPage.navigateToParentPage(); |
Use the state manager functions to control the state of your application.
Sets the application to a state in the state group of the state manager of the node where you call this function.
See goToNextDefinedState and goToPreviousDefinedState.
Syntax | goToState('stateGroup.state')
|
||||
Parameters |
|
||||
Examples | // Gets the value of the Layout Height property of the node where you execute the script. var height = node.getProperty('Node.Height'); // Checks the value of the Layout Height property. // If the value of the Layout Height property is less than or equals 50, sets the application // to the state named Empty in the state group named FuelGauge, which is in the state manager of the current node. if (height <= 50) { node.goToState('FuelGauge.Empty'); } // If the value of the Layout Height property is more than 50 and less than or equals 250, // sets the application to the state named Half in the state group named FuelGauge, which is in the state manager of the current node. else if (height > 50 && height <= 250) { node.goToState('StateGroup.Half'); } // For all other values of the Layout Height property, sets the application to the state // named Full in the state group named FuelGauge, which is in the state manager of the current node. else { node.goToState('StateGroup.Full'); } |
Sets the application to the next state in a state group of the state manager. When you reach the last state in a state group, the function sets the application to the first state in that state group.
See goToState and goToPreviousDefinedState.
Syntax | goToNextDefinedState('stateGroup')
|
||
Parameters |
|
||
Examples | // Sets the next state in the state group named MenuControl of the node where you execute the script. node.goToNextDefinedState('MenuControl'); |
Sets the application to the previous state in a state group of the state manager. When you reach the first state in a state group, the function sets the application to the last state in that state group.
See goToState and goToNextDefinedState.
Syntax | goToPreviousDefinedState('stateGroup')
|
||
Parameters |
|
||
Examples | // Sets the previous state in the state group named MenuControl of the node where you execute the script. node.goToPreviousDefinedState('MenuControl'); |
You can apply transformations in these ways:
Applies the layout rotation of a node. You can use this function only with 2D nodes.
Syntax | rotateLayout(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Applies 90 degree layout rotation.
text.rotateLayout(90);
|
Applies the layout rotation of a node around the x axis to the already existing rotation. You can use this function only with 3D objects.
Syntax | rotateXLayout(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Applies 120 degree rotation around the x axis.
text.rotateXLayout(120);
|
Applies the layout rotation of a node around the y axis to the already existing rotation. You can use this function only with 3D objects.
Syntax | rotateYLayout(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Applies 120 degree layout rotation around the y axis.
text.rotateYLayout(120);
|
Applies the layout rotation of a node around the z axis to the already existing rotation. You can use this function only with 3D objects.
Syntax | rotateZLayout(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Applies 120 degree layout rotation around the z axis.
text.rotateZLayout(120);
|
Sets the layout rotation of a node. You can use this function with both 2D and 3D nodes.
See getLayoutRotation, extractLayoutTransformEulerX, extractLayoutTransformEulerY, and extractLayoutTransformEulerZ.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Sets the layout rotation around the:
// - x axis to 15 degrees
// - y axis to 10 degrees
// - z axis to 0 degrees
text.setLayoutRotation(15, 10, 0); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the layout rotation to 90 degrees.
image.setLayoutRotation(90);
|
Gets the rotation in degrees of the Layout Transformation property of 2D nodes. To get the rotation of the Layout Transformation property of 3D nodes use extractLayoutTransformEulerX, extractLayoutTransformEulerY, and extractLayoutTransformEulerZ.
See setLayoutRotation.
Syntax | getLayoutRotation()
|
Returns |
int or float |
Examples | // Finds the Image node named Photo. var image = node.lookupNode('Photo'); // Gets the rotation from the Layout Transformation property of the selected node. var imageRotation = image.getLayoutRotation(); |
Gets the X Euler angle from the Layout Transformation Rotation X property field of 3D nodes. To get the rotation of the Layout Transformation property of 2D nodes use getLayoutRotation.
See setLayoutRotation.
Syntax | extractLayoutTransformEulerX()
|
|
Returns |
|
|
Examples | // Finds the Plane node called Plane. var plane = node.lookupNode('./Viewport 2D/Scene/Plane'); // Extracts the X Euler angle from the Layout Transformation property of the selected node. var xEulerAngle = plane.extractLayoutTransformEulerX(); |
Gets the Y Euler angle from the Layout Transformation Rotation Y property field of 3D nodes. To get the rotation of the Layout Transformation property of 2D nodes use getLayoutRotation.
See setLayoutRotation.
Syntax | extractLayoutTransformEulerY()
|
|
Returns |
|
|
Examples | // Finds the Button 3D node called Button 3D. var button = node.lookupNode('./Viewport 2D/Scene/Button 3D'); // Extracts the Y Euler angle from the Layout Transformation property of the selected node. var yEulerAngle = button.extractLayoutTransformEulerY(); |
Gets the Z Euler angle from the Layout Transformation Rotation Z property field of 3D nodes. To get the rotation of the Layout Transformation property of 2D nodes use getLayoutRotation.
See setLayoutRotation.
Syntax | extractLayoutTransformEulerZ()
|
|
Returns |
|
|
Examples | // Finds the Box node called Cube. var box = node.lookupNode('./Viewport 2D/Scene/Cube'); // Extracts the Z Euler angle from the Layout Transformation property of the selected node. var zEulerAngle = box.extractLayoutTransformEulerZ(); |
Applies the layout scaling of a node. You can use this function with both 2D and 3D nodes.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Applies the layout scaling of the node:
// - Increases the layout scale in the x axis by 100%.
// - Decreases the layout scale in the y axis by 10%.
// - Increases the layout scale in the z axis by 50%.
ball.scaleLayout(2, 0.9, 1.5); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Applies the layout scaling of the node:
// - Increases the layout scale in the x axis by 50%.
// - Decreases the layout scale in the y axis by 25%.
image.scaleLayout(1.5, 0.75);
|
Increases or decreases the layout scale of a node. You can use this function with both 2D and 3D nodes.
See getLayoutScale.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Sets the layout scale of the node:
// - In the x axis to 200%.
// - In the y axis to 10%.
// - In the z axis to 50%.
ball.setLayoutScale(2, 0.1, 0.5); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the layout scale of the node:
// - In the x axis to 150%
// - In the y axis to 75%.
image.setLayoutScale(1.5, 0.75);
|
Gets the current layout scale values of a node. You can use this function with both 2D and 3D nodes.
See setLayoutScale.
Syntax | getLayoutScale()
|
Returns | the layout rotation values for the x, y, and z axes |
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Gets the layout scale values for the x, y, and z axes.
text.getLayoutScale();
// Gets the layout scale value only for the x axis.
text.getLayoutScale()[0];
// Gets the layout scale value only for the z axis.
text.getLayoutScale()[2]; // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Gets the layout scale values for the x and y.
image.getLayoutScale();
// Gets the layout scale value only for the x axis.
image.getLayoutScale()[0];
|
Applies the layout translation to a node. You can use this function with both 2D and 3D nodes.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Applies the layout translation of the node:
// - Moves along the x axis by 2 device independent units.
// - Moves along the y axis by 0.5 device independent unit.
// - Moves along the z axis by 0.1 device independent unit.
ball.translateLayout(2, 0.5, 0.1); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Applies the layout translation of the node:
// - Moves along the x axis by 100 pixels.
// - Moves along the y axis by 50 pixels.
image.translateLayout(100, 50);
|
Sets the layout translation of a node. You can use this function with both 2D and 3D nodes.
See getLayoutTranslation.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Sets the layout translation of the node:
// - Moves along the x axis by 2 device independent units.
// - Moves along the y axis by 0.5 device independent unit.
// - Moves along the z axis by 0.1 device independent unit.
ball.setLayoutTranslation(2, 0.5, 0.1); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the layout translation of the node:
// - Moves along the x axis by 100 pixels.
// - Moves along the y axis by 50 pixels.
image.setLayoutTranslation(100, 50);
|
Gets the current layout translation values of a node. You can use this function with both 2D and 3D nodes.
See setLayoutTranslation.
Syntax | getLayoutTranslation()
|
Returns |
For 2D nodes: an array containing int or float for the layout translation values for the x and y axes. For 3D nodes: an array containing int or float for the layout translation values for the x, y, and z axes. |
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Gets the layout translation values for the x, y, and z axes.
text.getLayoutTranslation();
// Gets the layout translation value only for the x axis.
text.getLayoutTranslation()[0];
// Gets the layout translation value only for the z axis.
text.getLayoutTranslation()[2]; // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Gets the layout translation value of the node.
image.getLayoutTranslation();
// Gets the layout translation value only for the x axis.
image.getLayoutTranslation()[0];
// Gets the layout translation value only for the y axis.
image.getLayoutTranslation()[1];
|
You can apply transformations in these ways:
Applies the render rotation of a node. You can use this function only with 2D nodes.
Syntax | rotateRender(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Applies 90 degree render rotation.
text.rotateRender(90);
|
Applies the render rotation of a node around the x axis to the already existing rotation. You can use this function only with 3D objects.
Syntax | rotateXRender(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Applies 120 degree rotation around the x axis.
text.rotateXRender(120);
|
Applies the render rotation of a node around the y axis to the already existing rotation. You can use this function only with 3D objects.
Syntax | rotateYRender(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Applies 120 degree render rotation around the y axis.
text.rotateYRender(120);
|
Applies the render rotation of a node around the z axis to the already existing rotation. You can use this function only with 3D objects.
Syntax | rotateZRender(angle)
|
||
Parameters |
|
||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Applies 120 degree render rotation around the z axis.
text.rotateZRender(120);
|
Sets the render rotation of a node. You can use this function with both 2D and 3D nodes.
See getRenderRotation, extractRenderTransformEulerX, extractRenderTransformEulerY, and extractRenderTransformEulerZ.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Sets the render rotation around the:
// - x axis to 15 degrees
// - y axis to 10 degrees
// - z axis to 0 degrees
text.setRenderRotation(15, 10, 0); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the render rotation to 90 degrees.
image.setRenderRotation(90);
|
Gets the rotation in degrees of the Render Transformation property of 2D nodes. To get the rotation of the Render Transformation property of 3D nodes use extractRenderTransformEulerX, extractRenderTransformEulerY, and extractRenderTransformEulerZ.
See setRenderRotation.
Syntax | getRenderRotation()
|
Returns |
int or float |
Examples | // Finds the Image node named Photo. var image = node.lookupNode('Photo'); // Gets the rotation from the Render Transformation property of the selected node. var imageRotation = image.getRenderRotation(); |
Gets the X Euler angle from the Render Transformation Rotation X property field of 3D nodes. To get the rotation of the Render Transformation property of 2D nodes use getRenderRotation.
See setRenderRotation.
Syntax | extractRenderTransformEulerX()
|
|
Returns |
|
|
Examples | // Finds the Plane node called Plane. var plane = node.lookupNode('./Viewport 2D/Scene/Plane'); // Extracts the X Euler angle from the Render Transformation property of the selected node. var xEulerAngle = plane.extractRenderTransformEulerX(); |
Gets the Y Euler angle from the Render Transformation Rotation Y property field of 3D nodes. To get the rotation of the Render Transformation property of 2D nodes use getRenderRotation.
See setRenderRotation.
Syntax | extractRenderTransformEulerY()
|
|
Returns |
|
|
Examples | // Finds the Button 3D node called Button 3D. var button = node.lookupNode('./Viewport 2D/Scene/Button 3D'); // Extracts the Y Euler angle from the Render Transformation property of the selected node. var yEulerAngle = button.extractRenderTransformEulerY(); |
Gets the Z Euler angle from the Render Transformation Rotation Z property field of 3D nodes. To get the rotation of the Render Transformation property of 2D nodes use getRenderRotation.
See setRenderRotation.
Syntax | extractRenderTransformEulerZ()
|
|
Returns |
|
|
Examples | // Finds the Box node called Cube. var box = node.lookupNode('./Viewport 2D/Scene/Cube'); // Extracts the Z Euler angle from the Render Transformation property of the selected node. var zEulerAngle = box.extractRenderTransformEulerZ(); |
Applies the render scaling of a node. You can use this function with both 2D and 3D nodes.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Applies the render scaling of the node:
// - Increases the render scale in the x axis by 100%.
// - Decreases the render scale in the y axis by 10%.
// - Increases the render scale in the z axis by 50%.
ball.scaleRender(2, 0.9, 1.5); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Applies the render scaling of the node:
// - Increases the render scale in the x axis by 50%.
// - Decreases the render scale in the y axis by 25%.
image.scaleRender(1.5, 0.75);
|
Increases or decreases the render scale of a node. You can use this function with both 2D and 3D nodes.
See getRenderScale.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Sets the render scale of the node:
// - In the x axis to 200%.
// - In the y axis to 10%.
// - In the z axis to 50%.
ball.setRenderScale(2, 0.1, 0.5); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the render scale of the node:
// - In the x axis to 150%
// - In the y axis to 75%.
image.setRenderScale(1.5, 0.75);
|
Gets the current render scale values of a node. You can use this function with both 2D and 3D nodes.
See setRenderScale.
Syntax | getRenderScale()
|
Returns | the render rotation values for the x, y, and z axes |
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Gets the render scale values for the x, y, and z axes.
text.getRenderScale();
// Gets the render scale value only for the x axis.
text.getRenderScale()[0];
// Gets the render scale value only for the z axis.
text.getRenderScale()[2]; // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Gets the render scale values for the x and y.
image.getRenderScale();
// Gets the render scale value only for the x axis.
image.getRenderScale()[0];
|
Applies the render translation to a node. You can use this function with both 2D and 3D nodes.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Applies the render translation of the node:
// - Moves along the x axis by 2 device independent units.
// - Moves along the y axis by 0.5 device independent unit.
// - Moves along the z axis by 0.1 device independent unit.
ball.translateRender(2, 0.5, 0.1); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Applies the render translation of the node:
// - Moves along the x axis by 100 pixels.
// - Moves along the y axis by 50 pixels.
image.translateRender(100, 50);
|
Sets the render translation of a node. You can use this function with both 2D and 3D nodes.
See getRenderTranslation.
Syntax |
For 2D nodes: For 3D nodes: |
||||||
Parameters |
|
||||||
Examples |
// Finds the Sphere node named Ball.
var ball = node.lookupNode('Ball');
// Sets the render translation of the node:
// - Moves along the x axis by 2 device independent units.
// - Moves along the y axis by 0.5 device independent unit.
// - Moves along the z axis by 0.1 device independent unit.
ball.setRenderTranslation(2, 0.5, 0.1); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the render translation of the node:
// - Moves along the x axis by 100 pixels.
// - Moves along the y axis by 50 pixels.
image.setRenderTranslation(100, 50);
|
Gets the current render translation values of a node. You can use this function with both 2D and 3D nodes.
See setRenderTranslation.
Syntax | getRenderTranslation()
|
Returns |
For 2D nodes: an array containing int or float for the render translation values for the x and y axes. For 3D nodes: an array containing int or float for the render translation values for the x, y, and z axes. |
Examples |
// Finds the Text Block 3D node named Text.
var text = node.lookupNode('Text');
// Gets the render translation values for the x, y, and z axes.
text.getRenderTranslation();
// Gets the render translation value only for the x axis.
text.getRenderTranslation()[0];
// Gets the render translation value only for the z axis.
text.getRenderTranslation()[2]; // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Gets the render translation value of the node.
image.getRenderTranslation();
// Gets the render translation value only for the x axis.
image.getRenderTranslation()[0];
// Gets the render translation value only for the y axis.
image.getRenderTranslation()[1];
|
Sets the render transformation origin of the node.
The values of the render transformation origin are in percent of the node width and height. For example, see how these values define the render transformation origin of a node:
You can use this function only with 2D nodes.
See getRenderTransformationOrigin.
Syntax | setRenderTransformationOrigin(x, y)
|
||||
Parameters |
|
||||
Examples | // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the render transformation origin of the node to the
// bottom right corner of the node
image.setRenderTransformationOrigin(1, 1); // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Sets the render transformation origin of the node to the
// center of the node
image.setRenderTransformationOrigin(0.5, 0.5);
|
Gets the current render transformation origin.
The values of the render transformation origin are in percent of the node width and height. For example, see how these values define the render transformation origin of a node:
You can use this function only with 2D nodes.
See setRenderTransformationOrigin.
Syntax | getRenderTransformationOrigin()
|
Returns |
an array containing int or float for the render transformation origin values for the x and y axes in percent. |
Examples | // Finds the Image node named Photo.
var image = node.lookupNode('Photo');
// Gets the render transformation origin value of the node.
image.getRenderTransformationOrigin();
// Gets the render translation value only for the x axis.
image.getRenderTransformationOrigin()[0];
// Gets the render translation value only for the y axis.
image.getRenderTransformationOrigin()[1];
|