Switch class

A Material Design switch.

Used to toggle the on/off state of a single setting.

The switch itself does not maintain any state. Instead, when the state of the switch changes, the widget calls the onChanged callback. Most widgets that use a switch will listen for the onChanged callback and rebuild the switch with a new value to update the visual appearance of the switch.

If the onChanged callback is null, then the switch will be disabled (it will not respond to input). A disabled switch's thumb and track are rendered in shades of grey by default. The default appearance of a disabled switch can be overridden with inactiveThumbColor and inactiveTrackColor.

Requires one of its ancestors to be a Material widget.

Material Design 3 provides the option to add icons on the thumb of the Switch. If ThemeData.useMaterial3 is set to true, users can use Switch.thumbIcon to add optional Icons based on the different MaterialStates of the Switch.

This example shows a toggleable Switch. When the thumb slides to the other side of the track, the switch is toggled between on/off.
link

To create a local project with this code sample, run:
flutter create --sample=material.Switch.1 mysample

This example shows how to customize Switch using MaterialStateProperty switch properties.
link

To create a local project with this code sample, run:
flutter create --sample=material.Switch.2 mysample

This example shows how to add icons on the thumb of the Switch using the Switch.thumbIcon property.
link

To create a local project with this code sample, run:
flutter create --sample=material.Switch.3 mysample

This example shows how to use the ambient CupertinoThemeData to style all widgets which would otherwise use iOS defaults.
link

To create a local project with this code sample, run:
flutter create --sample=material.Switch.4 mysample

See also:

Inheritance

Constructors

Switch({Key? key, required bool value, required ValueChanged<bool>? onChanged, Color? activeColor, Color? activeTrackColor, Color? inactiveThumbColor, Color? inactiveTrackColor, ImageProvider<Object>? activeThumbImage, ImageErrorListener? onActiveThumbImageError, ImageProvider<Object>? inactiveThumbImage, ImageErrorListener? onInactiveThumbImageError, MaterialStateProperty<Color?>? thumbColor, MaterialStateProperty<Color?>? trackColor, MaterialStateProperty<Color?>? trackOutlineColor, MaterialStateProperty<double?>? trackOutlineWidth, MaterialStateProperty<Icon?>? thumbIcon, MaterialTapTargetSize? materialTapTargetSize, DragStartBehavior dragStartBehavior = DragStartBehavior.start, MouseCursor? mouseCursor, Color? focusColor, Color? hoverColor, MaterialStateProperty<Color?>? overlayColor, double? splashRadius, FocusNode? focusNode, ValueChanged<bool>? onFocusChange, bool autofocus = false})
Creates a Material Design switch.
const
Switch.adaptive({Key? key, required bool value, required ValueChanged<bool>? onChanged, Color? activeColor, Color? activeTrackColor, Color? inactiveThumbColor, Color? inactiveTrackColor, ImageProvider<Object>? activeThumbImage, ImageErrorListener? onActiveThumbImageError, ImageProvider<Object>? inactiveThumbImage, ImageErrorListener? onInactiveThumbImageError, MaterialTapTargetSize? materialTapTargetSize, MaterialStateProperty<Color?>? thumbColor, MaterialStateProperty<Color?>? trackColor, MaterialStateProperty<Color?>? trackOutlineColor, MaterialStateProperty<double?>? trackOutlineWidth, MaterialStateProperty<Icon?>? thumbIcon, DragStartBehavior dragStartBehavior = DragStartBehavior.start, MouseCursor? mouseCursor, Color? focusColor, Color? hoverColor, MaterialStateProperty<Color?>? overlayColor, double? splashRadius, FocusNode? focusNode, ValueChanged<bool>? onFocusChange, bool autofocus = false, bool? applyCupertinoTheme})
Creates an adaptive Switch based on whether the target platform is iOS or macOS, following Material design's Cross-platform guidelines.
const

Properties

activeColor → Color?
The color to use when this switch is on.
final
activeThumbImage → ImageProvider<Object>?
An image to use on the thumb of this switch when the switch is on.
final
activeTrackColor → Color?
The color to use on the track when this switch is on.
final
applyCupertinoTheme → bool?
Whether to apply the ambient CupertinoThemeData.
final
autofocus → bool
True if this widget will be selected as the initial focus when no other node in its scope is currently focused.
final
dragStartBehavior → DragStartBehavior
Determines the way that drag start behavior is handled.
final
focusColor → Color?
The color for the button's Material when it has the input focus.
final
focusNode → FocusNode?
An optional focus node to use as the focus node for this widget.
final
hashCode → int
The hash code for this object.
no setterinherited
hoverColor → Color?
The color for the button's Material when a pointer is hovering over it.
final
inactiveThumbColor → Color?
The color to use on the thumb when this switch is off.
final
inactiveThumbImage → ImageProvider<Object>?
An image to use on the thumb of this switch when the switch is off.
final
inactiveTrackColor → Color?
The color to use on the track when this switch is off.
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
materialTapTargetSize → MaterialTapTargetSize?
Configures the minimum size of the tap target.
final
mouseCursor → MouseCursor?
The cursor for a mouse pointer when it enters or is hovering over the widget.
final
onActiveThumbImageError → ImageErrorListener?
An optional error callback for errors emitted when loading activeThumbImage.
final
onChanged → ValueChanged<bool>?
Called when the user toggles the switch on or off.
final
onFocusChange → ValueChanged<bool>?
Handler called when the focus changes.
final
onInactiveThumbImageError → ImageErrorListener?
An optional error callback for errors emitted when loading inactiveThumbImage.
final
overlayColor → MaterialStateProperty<Color?>?
The color for the switch's Material.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
splashRadius → double?
The splash radius of the circular Material ink response.
final
thumbColor → MaterialStateProperty<Color?>?
The color of this Switch's thumb.
final
thumbIcon → MaterialStateProperty<Icon?>?
The icon to use on the thumb of this switch
final
trackColor → MaterialStateProperty<Color?>?
The color of this Switch's track.
final
trackOutlineColor → MaterialStateProperty<Color?>?
The outline color of this Switch's track.
final
trackOutlineWidth → MaterialStateProperty<double?>?
The outline width of this Switch's track.
final
value → bool
Whether this switch is on or off.
final

Methods

build(BuildContext context) → Widget
Describes the part of the user interface represented by this widget.
override
createElement() → StatelessElement
Creates a StatelessElement to manage this widget's location in the tree.
inherited
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.
override
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
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}) → 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