BeepControlWidget

Overview

BeepControlWidget is a paint-based WinForms widget that inherits from BaseControl. It uses an IWidgetPainter pipeline to render rich visuals without child controls. The Style property selects one of 10 built-in render modes; changing it at runtime immediately swaps the painter and triggers a repaint.

Toolbox icon: 🎛️
Category: Beep Widgets → Input Controls
Default size: 240 × 80
Namespace: TheTechIdea.Beep.Winform.Controls.Widgets

Key Features

🎛️ Ten Input Styles

From a simple toggle to a full range-selector — one control, ten behaviours.

✅ Strongly-Typed Values

ToggleValue, SliderValue, RangeValue, DateValue, NumberValue models carry all state.

🔔 ValueChanged Event

Universal ValueChanged event fires regardless of style; Data carries new value.

🎨 Theme Integration

Button, checkbox, and input colours all default to active theme tokens.

🚫 IsEnabled

Disabled state can be toggled at runtime; painters render the greyed-out style.

🖱️ OptionSelected

Dropdown and ButtonGroup fire OptionSelected with the chosen option string.

Style Variants (10)

Style Value	Description
`ToggleSwitch`	Animated on/off toggle with label.
`Slider`	Horizontal range slider with min/max labels.
`DropdownFilter`	Styled dropdown for list filtering.
`DatePicker`	Date-selection control with calendar pop-out.
`SearchBox`	Search input with magnifier icon and suggestion support.
`ButtonGroup`	Radio-style grouped button selection.
`CheckboxGroup`	Multiple checkbox list with individual labels.
`RangeSelector`	Dual-handle range selector for min/max input.
`ColorPicker`	Colour swatch picker with custom color option.
`NumberSpinner`	Numeric up/down spinner with typed input.

Properties

Property	Type	Default	Description
`Style`	ControlWidgetStyle	ToggleSwitch	Selects the input control painter.
`Title`	string	"Control Title"	Label drawn above or beside the control.
`IsEnabled`	bool	true	Enable/disable the interactive control.
`ShowLabel`	bool	true	Show/hide the title label.
`ToggleValue`	ToggleValue	(IsOn=false)	Toggle state for ToggleSwitch style.
`SliderValue`	SliderValue	(Value=50)	Slider position for Slider style.
`RangeValue`	RangeValue	(Min=0,Max=100)	Range handles for RangeSelector style.
`DateValue`	DateValue	(DateTime.Now)	Selected date for DatePicker style.
`NumberValue`	NumberValue	(Value=0)	Current number for NumberSpinner style.
`Options`	List<string>	[Option 1…]	List of options for Dropdown and ButtonGroup.
`SelectedOption`	string	""	Currently selected option string.
`SearchText`	string	""	Current search query text.
`CheckboxOptions`	List<CheckboxOption>	(3 items)	Options list for CheckboxGroup.

Inherits all BaseControl properties (Border, Padding, Theme colors, etc.).

Events

Event	Args Type	Description
`ValueChanged`	BeepEventDataArgs	Fired when the control value changes. Data contains new value.
`ControlClicked`	BeepEventDataArgs	Fired on any click within the control area.
`OptionSelected`	BeepEventDataArgs	Fired when an option is selected (Dropdown, ButtonGroup, Checkbox). Data contains selected option.

Basic Usage

// Toggle switch
var toggle = new BeepControlWidget
{
    Style      = ControlWidgetStyle.ToggleSwitch,
    Title      = "Dark Mode",
    ToggleValue = { IsOn = false },
    Size       = new Size(200, 60)
};

// Dropdown filter
var dropdown = new BeepControlWidget
{
    Style          = ControlWidgetStyle.DropdownFilter,
    Title          = "Filter by Status",
    Options        = new List { "All", "Active", "Inactive", "Pending" },
    SelectedOption = "All",
    Size           = new Size(220, 70)
};
this.Controls.Add(toggle);
this.Controls.Add(dropdown);

Event Handling

toggle.ValueChanged += (s, e) =>
{
    bool isOn = (bool)e.Data;
    ApplyDarkMode(isOn);
};

dropdown.OptionSelected += (s, e) =>
{
    string selected = (string)e.Data;
    FilterGrid(selected);
};

Best Practices

Set Style before adding the widget to the form to avoid double repaints.
Adjust Size to fit your layout — defaults are minimum comfortable sizes.
Read BeepEventDataArgs.Data in event handlers for context-specific click data.
Call Invalidate() after updating data properties to trigger a repaint.
Let theme colors flow from BeepStyling.CurrentTheme — avoid overriding color properties unless customization is explicitly desired.