Image

Draw an image to the screen

Inputs

Dimensions

Size Mode
Controls how the width and height is specified

  • Explicit - Set the width and height directly in pixels or percent. Percent is in relation to the parent, so 100% is the same size as the parent
  • Content Width - The image node will have the same width as the image it's drawing. The height is explicitly set
  • Content Height - The image node will have the same height as the image it's drawing. The width is explicitly set
  • Content Size - Both the width and the height will be set to the dimensions of the image

Placement

Align X
How to align the object in relation to its parent

Align Y
How to align the object in relation to its parent

Position X
The position on the horizontal axis in relation to its parent, specified in pixels

Position Y
The position on the vertical axis in relation to its parent, specified in pixels

Position Z
The position on the depth axis, interpreted in an unit with similar size as pixels

Image Properties

Image Path
The path to the image to draw

Fill Mode
Controls the size of the image in relation to the dimensions of the Image node. The image is always centered.

  • Original - The image has the same size as the source file
  • Aspect Fill - Scale the image so it covers the entire area of the Image node
  • Aspect Fit - Scale the image so it fits inside the bounds of the Image node
  • Fill - Stretch the image so it covers the entire are of the Image node

Clip Image
Clip the image to the bounds of the Image node

Appearance

Opacity
Set the opacity from 0 to 1. Values over 1 are allowed and will increase the value of the red, green and blue channels

Visible
Enables or disables to visibility of the object.

Color
Multiply the image with this color

Blend Mode
Choose between a set of blend modes

Corner Radius
The corner radius of the bounds of the Image node

Other

Ignore Touch
Disables touch on this objects. Makes it invisible to touch and touch will pass through to objects underneath

Block Touch
By default touch events will pass through an object and interact with objects underneath. By setting Block Touch to Yes no touch events will pass through

Depth
What depth layer to draw this object to. All objects default to layer 0. Higher layers will be drawn on top of lower layers

Transform

Scale X
Scales the object on the horizontal axis

Scale Y
Scales the object on the vertical axis

Rotation X
Rotates the object around the horizontal axis, making it rotate in 3D. Specified in degrees

Rotation Y
Rotates the object around the vertical axis, making it rotate in 3D. Specified in degrees

Rotation Z
Rotates the object around the depth axis, a standard 2D rotation. Specified in degrees

Pivot X
Controls the rotation pivot point. Can be specified in either % where 0% is on the left edge on the object, 50% is in the middle and 100% is on the right edge. Can also be specified in pixels

Pivot Y
Controls the rotation pivot point. Can be specified in either % where 0% is on the top edge on the object, 50% is in the middle and 100% is on the lower edge. Can also be specified in pixels

Pivot Z
Controls the rotation pivot point. Specified in pixels

Outputs

Other

This
A reference to this node. Used to connect to Drag nodes, custom Javascript nodes and more.

Child Index
The place this node has in relation to its parent. E.g. if a Group have three children, then the first child will have Child Index 0, the second child will have Child Index 1, and so on.

Touch

Tap
Emits a signal when the user presses and release on this object

Press
Emits a signal when the user presses inside the bounds of this object

Release
Emits a signal when the user releases touch inside the bounds of this object

Enter
Emits a signal when the user presses or moves from outside to inside the bounds this object

Exit
Emits a signal when the user releases or moves from inside to outside the bounds of this object

Move
Emits a signal when the user changes position inside the bounds of this object

Position

Position X
The horizontal position of this object in relation to its parent

Position Y
The vertical position of this object in relation to its parent

Screen Position X
Where this object is on the screen, in pixels

Screen Position Y
Where this object is on the screen, in pixels

Dimensions

Width
Current width of this object

Height
Current height of this object

Sign up to noodl newsletter

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.