Developer Portal
Quick StartsComposition scriptingAPIs and SDKsSupport
  • Portal overview
  • Quick start
  • REST API
    • Introduction
    • Rate limits
    • Authorization
    • How-to guides
      • Get a control app's API token
      • Get a composition's sub-composition IDs and names and their payload structures
      • Get a control app's model
      • Get a control app's metadata
      • Update a sub-composition's content
      • Update a sub-composition's animation state
      • Update a sub-composition's content and animation state in one call
      • Update multiple sub-compositions in one call
    • API reference
      • Get control app details
        • Get a control app's metadata
        • Get a control app's model
        • Get a control app's control data
      • Send data to a control app
        • Update a control app's content
        • Update a control app's animation state
      • Take out all of an app's output
  • Data stream API
    • Introduction
    • Rate limits
    • Authorization
    • How-to guides
      • Create a data stream
      • Link a data stream to a composition
      • Send data to an app using the data stream API
    • API reference
  • Composition scripting
    • Introduction
    • Overview
    • Quick start
      • Find sub-compositions and widgets
      • Read and update control nodes
      • Set text widget text properties
      • Read and update widget properties
      • Read control nodes and update widget properties
      • Set image widget URL property
      • Set table widget content property
    • Cheat sheets
      • Fundamentals
      • Interactive overlays
      • Best practices
    • Use cases
      • Read control nodes and generate HTML text
      • Read control nodes, generate HTML text with background
      • Text Ticker - Start ticker on "In" animation
    • Composition script editor reference
  • Software development kits
    • Graphics SDK
      • Getting started
      • Reference
        • SDK functions
        • Composition object
        • Sequencer object
      • Guides and examples
        • Load a composition with its token
        • Load a composition with its URL
        • Get the composition URL of an app instance
        • Sequencer VOD example
        • Control local preview of app
        • Load app instance output
    • Overlay SDK
      • Getting started
      • SDK functions
      • Use case examples
    • Widget SDK
      • Preparing your environment
      • Getting started
      • Reference
        • Widget UI definition
        • Widget callback functions
        • Time control object
        • Composition instance
      • Guides and examples
        • Widget example: CSS patterns
    • App SDK
  • Singular Basics
    • Overview of Singular
    • Managing overlays in the Dashboard
      • How to create a new composition
      • How to open a new app template
      • How to create an app for a composition
      • How to extract a composition from an app
      • How to find an app's shared app token and shared API URL
      • Dashboard reference
    • Building overlays in Composer
      • How to build a composition
      • How to set up layer logic to automate overlay transitions
      • How to set up control nodes to make widget properties available to a control app
      • Animating overlays
        • How to create timeline animations
        • How to create behavior animations
        • How to create update animations
      • How to make overlays interactive
      • How to adapt overlays to various screen sizes
      • Composer reference
    • Controlling overlays in Studio and UNO
      • How to use Studio
      • Studio reference
      • UNO reference
  • Support
    • Singular status
    • Support resources
    • Singular terminology
    • Performance Testing
Powered by GitBook
On this page
  • How to create a control node in the data interface and control panel
  • How to create a control node with the node link browser

Was this helpful?

  1. Singular Basics
  2. Building overlays in Composer

How to set up control nodes to make widget properties available to a control app

PreviousHow to set up layer logic to automate overlay transitionsNextAnimating overlays

Last updated 2 years ago

Was this helpful?

Control nodes expose widgets in a composition to a control application or the Singular APIs so that you can dynamically update them without having to go into the composition itself.

In this guide, you'll learn how to create control nodes in the and in the . The examples show a control node being made for a text widget, but you can also create control nodes for various other types of widgets.

To follow this guide, you'll need a composition. If you don't have one, first learn or .

How to create a control node in the data interface and control panel

  1. Open a composition in Composer.

  2. Navigate to the data interface and control panel and select Text from the drop-down menu.

  3. Name the control node in Field name.

  4. In the composition tree, select a widget to connect to the control node. (You might need to click into a group or sub-composition to find the widget.)

  5. In the property panel, select the text tab and click Text just under it. The link browser will appear.

  6. In the link browser, select the name of the control node you just created.

  7. Back in the data interface and control panel, you can change the text for the control node.

How to create a control node with the node link browser

  1. Open a composition in Composer.

  2. Navigate to the composition tree and select a text widget. (You might need to click into a sub-composition or group to see the widgets.)

  3. In the property panel, select the text tab and click Text just under it. The link browser will appear.

  4. In the link browser, name the control node in the text field and select Add.

  5. Navigate to the data interface and control panel and find the control node that you just created.

  6. In the text field to the right of the control node name, you can change the text.

data interface and control panel
node link browser
how to build a composition
extract a composition from a Singular template
Creating and naming a control node
Selecting a widget to connect to the control node
Linking a widget to a control node
Finding a new control node in the data interface and control panel
Selecting a text widget from the composition tree
Naming a control node
Finding a new control node in the data interface and control panel