Comment on page
Set text widget text properties
This example explains how to update single-line and multi-line text in a text widget.
comp.findWidget()
widget.getPayload()
widget.setPayload()
The example composition has one sub-composition called Lower, as you can see in the composition tree.
The Lower sub-composition
To see this sub-composition's widgets:
- 1.Open the composition script editor within the same example composition as above and select the Lower composition script.
- 2.In the composition navigator, select the Widget Explorer tab.
This composition contains three widgets, but for this quick start, you'll look at the text widgets, which in the composition are called lowerTitle and lowerSubtitle.
The sub-composition's widgets
Now that you have located the composition's text widgets, learn how to set them by reading the comments in the Lower composition script.
You can also copy and paste the composition script below into your own compositions.
Lower Script
(function() {
return {
init: function(comp, context) {
// get reference to the title and subtitle widget
const wiLowerTitle = comp.findWidget("lowerTitle")[0];
const wiLowerSubtitle = comp.findWidget("lowerSubtitle")[0];
// update the single-line title
wiLowerTitle.setPayload({
"text": "This is the new title"
});
// update the multi-line subtitle
wiLowerSubtitle.setPayload({
"text": "New subtitle line 1\nNew subtitle line 2"
});
},
close: function(comp, context) {}
};
})();
Last modified 1yr ago