Make Canvas look like Song buttons on a Stream Deck?

EDIT: I believe I have it figured out, but is there a way to have it pull in the song title for the button label? This way the buttons will always be in the same order as the setlist and show the title? I have my setlist automatically starting the next song, but it would be nice the know what song the button represents for times we get a song request and I have to go manually hunting for a song.

Is there a way to make canvas look like song buttons on a stream deck? In other words I would like to build a canvas that has my entire song list, but not in list form. I would rather see a button view where they would all fit on the screen at one time so I do not have to scroll through the list to find a song and kick it off. If this is possible, can I get a brief explanation on what elements to add to achieve this?

Hey @Eric,

That’s a good idea actually.

At the moment, there isn’t a built-in way to have each button dynamically pull the title of a specific song from the setlist by index.

That said, if it helps your workflow, you could manually create your grid of buttons, assign each one to a position in the setlist using /setlist/jumpToSong [index], and then manually label each button with the corresponding song name.

This way, your buttons will always follow the setlist order (since they’re index-based), even if the labels themselves aren’t dynamically generated.

It’s not fully automatic, but it can still get you very close to what you’re looking for.

Hope that helps!

1 Like

Thank you for your reply @agustinvolpe -

I think I have it working the way you described.

The other positive for adding this as a future feature to pull the name dynamically is, if you have name the button manually, and then set the OSC to pull by number of the setlist order, when you re-order the setlist, the name won’t change dynamically with the new song order.

This is the look I’m aiming for on the canvas:

Hey @Eric,

I should’ve remembered this use case earlier.

Thanks to @Adam_Molinaro in the other thread, I revisited it and this actually works perfectly using the same indexed OSC logic.

For the button label, you can use:

${osc("/setlist/songs", 0 + local("songOffset")) ?? ""}

And for the button action (set to Script):

const currentOffset = local("songOffset", 0);
sendOsc("/setlist/jumpToSong", 1 + currentOffset);

From there, you can duplicate the button and increment the index for each one:

  • Button 1
    Label: 0 + local("songOffset")
    Jump: 1 + currentOffset

  • Button 2
    Label: 1 + local("songOffset")
    Jump: 2 + currentOffset

  • Button 3
    Label: 2 + local("songOffset")
    Jump: 3 + currentOffset

…and so on.

Kudos to Adam for pointing this out! I’d been a bit swamped and it slipped my mind.

Hope that helps!

3 Likes

Thanks to both of you guys! Works perfectly! You just made my life very easy! :slight_smile:

2 Likes