Skip to main content

JSX/TSX React

Use WmsControls

Deprecated (v6.1.0): ReactUI.WmsControls replaces ReactUI.PlaybackButtons. ReactUI.PlaybackButtons is deprecated and will be removed in a future major release. Existing code can be migrated by renaming ReactUI.PlaybackButtons to ReactUI.WmsControls.
New Feature (v6.3.0): doc.getDefaultPlayer() and player property of WmsControls.
// Create controls and set document
const doc = new Score.DocumentBuilder().getDocument();
<ReactUI.WmsControls doc={doc} />

// Use with default player (since v6.3.0)
const player = doc.getDefaultPlayer();
<ReactUI.WmsControls player={player} />

// Use with new player (since v6.3.0)
const player = new Score.Player(doc);
<ReactUI.WmsControls player={player} />

// Create single Play button
<ReactUI.WmsControls doc={doc} singlePlay />

// Create single Play/Stop toggle button
<ReactUI.WmsControls doc={doc} singlePlayStop playLabel="Play" stopLabel="Stop" />

// Create Play and Stop buttons
<ReactUI.WmsControls doc={doc} playStop playLabel="▶" stopLabel="⏹" />

// Create Play, Pause and Stop buttons
<ReactUI.WmsControls doc={doc} playPauseStop />
💡
Default labels if omitted are "Play", "Pause" and "Stop".

Live Example