Jamba Views / Switch View Container

Switch View Container

 Switch View Container

This view offers dynamic switching between multiple views.

Switching is based on the value of any parameter (both Vst and Jmb) that is (or can be interpreted as) a discrete parameter.

The VST SDK comes with a similar implementation which a) is buggy, b) requires an actual control tied to a Vst parameter (so for example does not work with StepButtonView or cannot be changed by the RT). This implementation uses a parameter directly so has none of these restrictions.

Info

When editing the layout using the editor, and saving the xml file, unfortunately the editor will save the children of this class (in this case, the one that was added dynamically). Although the code handles this case, it is recommended (for production) to manually edit the xml file to remove any child of this entry (otherwise objects will be created to be destroyed right away).

In addition to the attributes exposed by CViewContainer, this class exposes the following attributes:

Attribute Description
switch-control-tag id for the parameter tied to switching. It can be any parameter (both Vst and Jmb) that is (or can be interpreted as) a discrete parameter.
template-names A comma separated list of template names. Should refer to valid templates (in the xml file)

The image above shows an example of 3 discrete buttons (tied to a single vst parameter) which switches between 3 different views (editing, sampling and exporting).

Tip

This view lets you implement tabs!

Example

The json defining the switch container and the 3 discrete buttons: all tied to the same Param_EditingMode vst param and the 3 templates referenced by name (Source)

		"jamba::SwitchViewContainer": {
			"attributes": {
				"background-color": "Slice_Line_Color",
				"background-color-draw-style": "filled and stroked",
				"class": "jamba::SwitchViewContainer",
				"editor-mode": "false",
				"mouse-enabled": "true",
				"opacity": "1",
				"origin": "9, 229",
				"size": "556, 155",
				"switch-control-tag": "Param_EditingMode",
				"template-names": "edit_edit_tab,edit_sample_tab,edit_io_tab",
				"transparent": "true",
				"wants-focus": "false"
			}
		},
		"jamba::DiscreteButton": {
			"attributes": {
				"back-color": "~ TransparentCColor",
				"button-image": "action_switch_edit_edit_tab",
				"class": "jamba::DiscreteButton",
				"control-tag": "Param_EditingMode",
				"editor-mode": "false",
				"frames": "2",
				"inverse": "false",
				"mouse-enabled": "true",
				"on-color": "~ RedCColor",
				"opacity": "1",
				"origin": "568, 240",
				"size": "26, 26",
				"step": "0",
				"step-count": "-1",
				"transparent": "false",
				"wants-focus": "false"
			}
		},
		"jamba::DiscreteButton": {
			"attributes": {
				"back-color": "~ TransparentCColor",
				"button-image": "action_switch_edit_sample_tab",
				"class": "jamba::DiscreteButton",
				"control-tag": "Param_EditingMode",
				"editor-mode": "false",
				"frames": "2",
				"inverse": "false",
				"mouse-enabled": "true",
				"on-color": "~ RedCColor",
				"opacity": "1",
				"origin": "568, 265",
				"size": "26, 26",
				"step": "1",
				"step-count": "-1",
				"transparent": "false",
				"wants-focus": "false"
			}
		},
		"jamba::DiscreteButton": {
			"attributes": {
				"back-color": "~ TransparentCColor",
				"button-image": "action_switch_edit_io_tab",
				"class": "jamba::DiscreteButton",
				"control-tag": "Param_EditingMode",
				"editor-mode": "false",
				"frames": "2",
				"inverse": "false",
				"mouse-enabled": "true",
				"on-color": "~ RedCColor",
				"opacity": "1",
				"origin": "568, 290",
				"size": "26, 26",
				"step": "2",
				"step-count": "-1",
				"transparent": "false",
				"wants-focus": "false"
			}
		}
	}
},
...
"edit_edit_tab": {
	"attributes": {
		"background-color": "~ TransparentCColor",
		"background-color-draw-style": "filled and stroked",
		"bitmap": "edit_edit_tab_background",
		"class": "CViewContainer",
		"mouse-enabled": "true",
		"opacity": "1",
		"origin": "0, 0",
		"size": "556, 155",
		"transparent": "false",
		"wants-focus": "false"
	}, ... },
"edit_sample_tab": {
	"attributes": {
		"background-color": "~ TransparentCColor",
		"background-color-draw-style": "filled and stroked",
		"bitmap": "edit_sample_tab_background",
		"class": "CViewContainer",
		"mouse-enabled": "true",
		"opacity": "1",
		"origin": "0, 0",
		"size": "556, 155",
		"transparent": "false",
		"wants-focus": "false"
	}, ... },
"edit_io_tab": {
	"attributes": {
		"background-color": "~ TransparentCColor",
		"background-color-draw-style": "filled and stroked",
		"bitmap": "edit_io_tab_background",
		"class": "CViewContainer",
		"mouse-enabled": "true",
		"opacity": "1",
		"origin": "0, 0",
		"size": "556, 155",
		"transparent": "false",
		"wants-focus": "false"
	}, ... }

The vst param is defined this way (EEditingMode is an enum with 3 values) (Source)

VstParam<EEditingMode> fEditingMode; // which subtab to show (edit/sample)

The vst param is initialized this way (Source)

fEditingMode =
  vst<EnumParamConverter<EEditingMode, EEditingMode::kEditingIO>>(ESampleSplitterParamID::kEditingMode,
                                                                  STR16("Edit Mode"),
                                                                  {{STR16("Edit"),
                                                                     STR16("Sample"),
                                                                     STR16("IO")}})
    .defaultValue(EEditingMode::kEditingEdit)
    .shortTitle(STR16("EditMode"))
    .guiOwned() // purely GUI concept
    .transient() // no need to save which we are on with the state
    .add();