Is there a way to create a custom settings toggle button?

Support
, , ,
1

Product

Player

Question

I’m creating a custom ui config for bitmovin on my react app but I’m not sure how can I create a custom SettingsToggleButton because there is not documentation about it. This is what I have so far:

new SettingsToggleButton({
    autoHideWhenNoActiveSettings: false,
    settingsPanel: new SettingsPanel({
      components: [
        new SettingsPanelPage({
            title: 'Las settings',
          components: [
            new SettingsPanelItem({
                label: 'Label Text', 
              }),
          ]
        })
      ]
    })
  });

Actually I can see the button, but if I click on it nothing happens.

2

Hi,
The following code sample shows how to create a custom Setting menu and button.

Please let me know in case you have any questions.

1 Like
3

Thanks for the help Ludo, I’m able to see the settings toggle button but when I click on it nothing happens and nothing is displayed, just an empty click. This is what I got so far

export const settingsToggleButton = new SettingsToggleButton({
    autoHideWhenNoActiveSettings: true,
    text: 'The Settings',
    settingsPanel: new SettingsPanel({
      components: [
        new SettingsPanelPage({
          tabIndex: 0,
          components: [
            new SettingsPanelItem('Quality',new VideoQualitySelectBox()),
            new SettingsPanelItem('Speed',new PlaybackSpeedSelectBox()),
          ]
        })
      ],
      hidden: true
    })
  });

I was checking the repo that you send to me and everything seems alrigth, I’m not sure what I’m missing

4

I found the problem, we have to add the settingsPanel to the ControlBar first and then add it again (not sure why) to the SettingsToggleButton inside of a Container within the same ControlBar.

5

This topic was automatically closed 60 minutes after the last reply. New replies are no longer allowed.