ShadToggle class

A two-state button that stays pressed when on.

Mirrors shadcn/ui's Toggle. Use it for a single on/off control that reads as a button rather than a checkbox — bold/italic in a text toolbar, for example. For a set of related toggles, use ShadToggleGroup.

ShadToggle(
  value: bold,
  onChanged: (v) => setState(() => bold = v),
  child: const Icon(LucideIcons.bold),
)

Prefer ShadSwitch when the control turns a setting on and off, and ShadCheckbox when it selects an item. This is for a formatting-style action.

Inheritance
Available extensions

Constructors

ShadToggle({Key? key, required bool value, required Widget child, ValueChanged<bool>? onChanged, bool enabled = true, Widget? leading, Color? backgroundColor, Color? hoverBackgroundColor, Color? selectedBackgroundColor, Color? selectedHoverBackgroundColor, Color? foregroundColor, Color? hoverForegroundColor, Color? selectedForegroundColor, EdgeInsetsGeometry? padding, ShadDecoration? decoration, TextStyle? textStyle, double? gap, double? height, double? width, FocusNode? focusNode, bool autofocus = false, ValueChanged<bool>? onFocusChange, ShadStatesController? statesController, String? semanticLabel})
A two-state button that stays pressed when on.
const
ShadToggle.outline({Key? key, required bool value, required Widget child, ValueChanged<bool>? onChanged, bool enabled = true, Widget? leading, Color? backgroundColor, Color? hoverBackgroundColor, Color? selectedBackgroundColor, Color? selectedHoverBackgroundColor, Color? foregroundColor, Color? hoverForegroundColor, Color? selectedForegroundColor, EdgeInsetsGeometry? padding, ShadDecoration? decoration, TextStyle? textStyle, double? gap, double? height, double? width, FocusNode? focusNode, bool autofocus = false, ValueChanged<bool>? onFocusChange, ShadStatesController? statesController, String? semanticLabel})
A bordered toggle, matching shadcn/ui's variant="outline".
const
ShadToggle.raw({Key? key, required ShadToggleVariant variant, required bool value, required Widget child, ValueChanged<bool>? onChanged, bool enabled = true, Widget? leading, Color? backgroundColor, Color? hoverBackgroundColor, Color? selectedBackgroundColor, Color? selectedHoverBackgroundColor, Color? foregroundColor, Color? hoverForegroundColor, Color? selectedForegroundColor, EdgeInsetsGeometry? padding, ShadDecoration? decoration, TextStyle? textStyle, double? gap, double? height, double? width, FocusNode? focusNode, bool autofocus = false, ValueChanged<bool>? onFocusChange, ShadStatesController? statesController, String? semanticLabel})
Creates a toggle with a specified variant, allowing full control.
const

Properties

autofocus → bool
final
backgroundColor → Color?
The background color when off.
final
child → Widget
The content of the toggle, usually an Icon or a Text.
final
decoration → ShadDecoration?
The decoration of the toggle.
final
enabled → bool
Whether the toggle responds to input, defaults to true.
final
focusNode → FocusNode?
final
foregroundColor → Color?
The content color when off.
final
gap → double?
The gap between leading and child.
final
hashCode → int
The hash code for this object.
no setterinherited
height → double?
The height of the toggle.
final
hoverBackgroundColor → Color?
The background color when off and hovered.
final
hoverForegroundColor → Color?
The content color when off and hovered.
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
leading → Widget?
An optional widget shown before child.
final
onChanged → ValueChanged<bool>?
Called with the new value when the toggle is pressed.
final
onFocusChange → ValueChanged<bool>?
final
padding → EdgeInsetsGeometry?
The padding inside the toggle.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
selectedBackgroundColor → Color?
The background color when on.
final
selectedForegroundColor → Color?
The content color when on.
final
selectedHoverBackgroundColor → Color?
The background color when on and hovered.
final
semanticLabel → String?
The accessible name, needed when child is icon-only.
final
statesController → ShadStatesController?
final
textStyle → TextStyle?
The text style of the label.
final
value → bool
Whether the toggle is on.
final
variant → ShadToggleVariant
final
width → double?
The width of the toggle. Null sizes to the content.
final

Methods

animate({Key? key, List<Effect>? effects, AnimateCallback? onInit, AnimateCallback? onPlay, AnimateCallback? onComplete, bool? autoPlay, Duration? delay, AnimationController? controller, Adapter? adapter, double? target, double? value}) → Animate

Available on Widget, provided by the AnimateWidgetExtensions extension

Wraps the target Widget in an Animate instance, and returns the instance for chaining calls. Ex. myWidget.animate() is equivalent to Animate(child: myWidget).
createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<ShadToggle>
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
positionedWith(ShadPosition position) → Widget

Available on Widget, provided by the PositionedExt extension

toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited