Slideshow.svg

The Slideshow Widget is an Advanced Widget that generates a slideshow with the help of some JSON.


To learn how to add a Widget to your Composition, click here.

Remember, any underlined widget properties can be connected to a Control Node or a Data Node.

Property Settings

As seen above, select the "Slideshow" tab in the Property Panel to update this widget's following property types:

Settings

Playlist Box - For inputting a playlist in JSON format

Example JSON Playlist: 

[
{
"duration": 3,
"payload": {
"Flag": "https://upload.wikimedia.org/wikipedia/en/0/03/Flag_of_Italy.svg",
"Country": "Italy"
}
},
{
"duration": 3,
"payload": {
"Flag": "https://upload.wikimedia.org/wikipedia/en/thumb/b/ba/Flag_of_Germany.svg/1280px-Flag_of_Germany.svg.png",
"Country": "Germany"
}
},
{
"duration": 3,
"payload": {
"Flag": "https://cmkt-image-prd.global.ssl.fastly.net/0.1.0/ps/3696247/1820/1213/m1/fpnw/wm0/japan-.jpg?1512571282&s=4f4ddbc67280c4a65d45909639bb5999",
"Country": "Japan"
}
}
]

Feel free to customize the contents of the JSON to add more flags, change the flag images and country names, or update the duration that each flag is visible. You can also add or replace data fields (as long as the JSON structure remains the same).

Miscellaneous

Auto play - Checkbox to Auto play your JSON playlist

Composition - The Slideshow Widget is an Advanced Widget. This means it requires another layer of customization. In order to build the contents of this Slideshow Widget, you have to hit this Edit button.

Loop - Checkbox to activate looping your JSON playlist

Play Button - Button to start your JSON playlist

Edit Button - Building the Slideshow Widget Elements

First hit the "Edit" button in the Miscellaneous property box to get started. We are using the example JSON so we will be creating a slideshow of flags and text. For this, we will need to add an Image Widget and a Text Widget. We arranged ours with the image above the text.

Adding an Image and Text Widget 

For these elements to work properly with your JSON, you have to create Control Nodes for the Image and Text Widgets. Add connected Control Nodes by using the Node Link Browser. Make sure to name them as they are named in the JSON: call your Image Control Node "Flag" and your Text Control Node "Country". This is very important because we use this exact naming in our example JSON playlist. If you do not name the Control Nodes in this way, the Slideshow Widget will not work.  

Adding Control Nodes with the Node Link Browser

Go back to the root level of this Widget and hit Play in the Miscellaneous Property box to see the playlist play out properly with the country names and flags.

Was this article helpful?
2 out of 6 found this helpful

Comments

1 comment

  • Could it be more complicated? 

    0

Please sign in to leave a comment.