Button
button creates a button on screen that can be used for a whole range of tasks. The "channel" string identifies the channel on which Cabbage will communicate with Csound.
Properties (alphabetical)
Below is the full, alphabetical list of top-level widget properties for button.
Active
"active": 0
Will deactivate a control if 0 is passed. Controls which are deactivated can still be updated from Csound.
Automatable
"automatable": 1
Defaults to 1. Determines if a widget is automatable by a host DAW. Automatable widgets show up as plug-in parameters in the host. Non-automatable widgets can still communicate with Csound but are not accessible by the host. Note that hosts don't allow this parameter to change dynamically. If you change this setting, the plugin will need to be reloaded.
Bounds
"bounds": {"left":0, "top":0, "width":100, "height":100}
Integer values that set position and size on screen(in pixels).
Channel
"channels": [
{
"id":"channelName",
"eventType": "valueChanged",
"range": {"min":0, "max":100, "value":0, "skew":1, "incr":0.1}
}
]
In Cabbage 3, widgets use an array of channels instead of a single channel string. Each channel object includes an id that defines a unique channel name. Widgets in Cabbage 3 can have any number of channels attached to them. An optional eventType property specifies the type of interaction. A range object can define the minimum, maximum, and default values, along with the skew and step increment.
If range is omitted, it defaults to a range from 0 to 1, with increments of 0.001 for widgets that use drag events (e.g., sliders, XY pads) and 1 for widgets that use click or toggle events (e.g., buttons, checkboxes).
A widget’s top-level id property defines the general communication channel for updating attributes, while the channels specified in the channels array are used for value and parameter updates.
Supported event types:
| Event | Description |
|---|---|
valueChanged (default) | Tracks simple value changes |
mousePressLeft | Tracks presses of left mouse button |
mousePressRight | Tracks presses of right mouse button |
mousePressMiddle | Tracks presses of middle mouse button |
mouseMoveX | Tracks movement along X axis. |
mouseMoveY | Tracks movement along Y axis. |
mouseDragX | Tracks movement along X axis with mouse pressed |
mouseDragY | Tracks movement along Y axis with mouse pressed |
mouseInside | Returns max when any mouse button is within the bounds of the widget, min if outside. |
In Cabbage 3, channels don't need to start with a letter and white spaces are permitted.
Id
"id": "widgetId"
This optional channel can be used to define a top-level line of communication between the instrument’s UI and Csound. It is reserved for UI updates only. If omitted, it defaults to the first id from the channels array. Its primary purpose is to help produce clearer code, especially for widgets with multiple channels.
Label
"label": {
"text": "",
"offsetY": 0
}
Configures the widget label displayed near the control.
- text: string — the label text.
- offsetY: number — vertical offset applied when the label is rendered outside the control (pixels).
Typography (font size, color, family, alignment) is set via style.label.*.
Visible
"visible": 1
A value of 0 will cause the widget to become invisible. Widgets have their visibility set to 1 by default.
Style
"style": {
"opacity": 1,
"borderRadius": 4,
"borderWidth": 0,
"borderColor": "#dddddd",
"on": {
"backgroundColor": "#3d800a",
"textColor": "#dddddd"
},
"off": {
"backgroundColor": "#3d800a",
"textColor": "#dddddd"
},
"hover": {
"backgroundColor": "#4ca10c",
"textColor": "#dddddd"
},
"active": {
"backgroundColor": "#2d6008",
"textColor": "#dddddd"
}
},
- Colors accept named CSS colors, hex (e.g., #RRGGBB or #RRGGBBAA), or rgb/rgba strings.
- The label text is configured under
label.text.onandlabel.text.off. - Border radius/width/color control the button outline.
Example
<Cabbage>
[
{"type": "form", "caption": "Button Example", "size": {"width": 380, "height": 300}, "pluginId": "def1"},
{
"type": "button",
"bounds": {"left": 16, "top": 12, "width": 117, "height": 30},
"channels": [{"id": "trigger", "event": "valueChanged"}],
"label": {"text": {"off": "Start Synth", "on": "Stop Synth"}}
},
{
"type": "button",
"bounds": {"left": 146, "top": 12, "width": 80, "height": 30},
"channels": [{"id": "mute", "event": "valueChanged"}],
"label": {"text": {"off": "Unmute", "on": "Mute"}},
"style": {
"off": {"backgroundColor": "#993d00", "textColor": "#ffffff"},
"on": {"backgroundColor": "#cc5200", "textColor": "#ffffff"}
}
},
{
"type": "button",
"bounds": {"left": 240, "top": 12, "width": 121, "height": 30},
"channels": [{"id": "toggleFreq", "event": "valueChanged"}],
"label": {"text": {"off": "Toggle Freq", "on": "Toggle Freq"}},
"style": {
"off": {"backgroundColor": "#1da96f", "textColor": "#ffffff"},
"on": {"backgroundColor": "#0295cf", "textColor": "#ffffff"}
}
}
]
</Cabbage>
<CsoundSynthesizer>
<CsOptions>
-n -d -+rtmidi=NULL -M0 -m0d
</CsOptions>
<CsInstruments>
; Initialize the global variables.
ksmps = 32
nchnls = 2
0dbfs = 1
; Rory Walsh 2021
;
; License: CC0 1.0 Universal
; You can copy, modify, and distribute this file,
; even for commercial purposes, all without asking permission.
instr 1
val:k, trig:k = cabbageGetValue("trigger")
if trig == 1 then
if val == 1 then
event("i", "Synth", 0, 3600)
else
instrNum:i = nstrnum("Synth")
turnoff2(instrNum, 0, 0)
endif
endif
endin
instr Synth
prints("Starting Synth")
mute:k = cabbageGetValue("mute")
outSig:a = oscili(.5*mute, 300*(cabbageGetValue("toggleFreq")+1))
outs(outSig, outSig)
endin
</CsInstruments>
<CsScore>
;starts instrument 1 and runs it for a week
i1 0 z
</CsScore>
</CsoundSynthesizer>
"visible": 1
A value of 0 will cause the widget to become invisible. Widgets have their visibility set to 1 by default.