Skip to content
ModernUI A DaneTrades developer library

Checkbox, Toggle, and Slider

Use these controls for simple state and range values.

Main helpers

Helper Use it for
Mui::Checkbox Boolean option with a label
Mui::LabeledCheckbox Form-style checkbox row
Mui::Toggle Switch-style boolean value
Mui::Slider Generic slider
Mui::HorizontalSlider Horizontal range control
Mui::VerticalSlider Vertical range control
Mui::LabeledSlider Form-style labelled slider

Checkbox

UI build fragment
MuiCheckbox *confirm=Mui::Checkbox(parent,"Confirm before action",NULL);

For forms:

UI build fragment
MuiLabeledCheckbox confirm=Mui::LabeledCheckbox(
  section.body,
  "Confirm before action",
  true,
  "Recommended for broker-facing actions."
);

Toggle

UI build fragment
MuiToggle *enabled=Mui::Toggle(parent,true,NULL);

Use toggles for on/off state where a switch visual is clearer than a checkbox.

Slider

UI build fragment
MuiSlider *slider=Mui::HorizontalSlider(
  parent,
  0.0,
  1.0,
  0.35,
  NULL,
  220.0,
  0.0
);

For forms:

UI build fragment
MuiLabeledSlider sensitivity=Mui::LabeledSlider(
  section.body,
  "Sensitivity",
  0.0,
  1.0,
  0.05,
  0.35,
  0.0,
  0.0,
  "Approximate range value."
);

Slider geometry and knobs

ModernUI sliders use a compact theme-driven height. When height is 0.0, factory sliders use MuiTheme::SliderHeight() rather than the generic button/input height.

The thumb and fill share the same geometry model: the fill ends at the painted thumb centre, and the thumb is clamped so it stays visible at minimum and maximum values. Horizontal and vertical sliders preserve their existing value direction.

Sliders support circle and rectangle knob styles where available:

UI build fragment
if(sensitivity.control!=NULL)
{
  sensitivity.control.UseCircleKnob();
  // or: sensitivity.control.UseRectangleKnob();
}

You can override the automatic thumb size when needed:

UI build fragment
if(sensitivity.control!=NULL)
  sensitivity.control.ThumbSize(18.0); // <= 0 resets to automatic sizing

Use explicit thumb sizing sparingly. The automatic sizes are designed to match the rail thickness and dense/normal theme metrics.

Reading values

UI build fragment
if(confirm.control!=NULL)
{
  bool checked=confirm.control.Checked();
  confirm.control.Checked(false);
}

if(sensitivity.control!=NULL)
{
  double value=sensitivity.control.Value();
  sensitivity.control.Value(0.50);
}

Slider customisation

UI build fragment
if(sensitivity.control!=NULL)
{
  sensitivity.control.AccentColor(0xFF3B82F6);
}

Use SpinEdit when the value must be exact. Use Slider when the user is adjusting a relative or approximate value.

Common uses

Control Useful for
Checkbox confirm before send, enable alerts, hide closed rows
Toggle enabled/disabled mode, compact/expanded UI
Slider risk/reward multiple, sensitivity, opacity, threshold
SpinEdit exact numeric value

Common mistakes

Using a slider for exact numbers

If a user must enter exactly 1.25, use SpinEdit.

Using checkbox and toggle inconsistently

Pick one style for similar settings within the same panel.

Assuming UI state has business meaning automatically

A checkbox only stores UI state. Your EA decides what that state does.

Related pages