SegmentedButton<T> class

A Material button that allows the user to select from limited set of options.

Segmented buttons are used to help people select options, switch views, or sort elements. They are typically used in cases where there are only 2-5 options.

The options are represented by segments described with ButtonSegment entries in the segments field. Each segment has a ButtonSegment.value that is used to indicate which segments are selected.

The selected field is a set of selected ButtonSegment.values. This should be updated by the app in response to onSelectionChanged updates.

By default, only a single segment can be selected (for mutually exclusive choices). This can be relaxed with the multiSelectionEnabled field.

Like ButtonStyleButtons, the SegmentedButton's visuals can be configured with a ButtonStyle style field. However, unlike other buttons, some of the style parameters are applied to the entire segmented button, and others are used for each of the segments.

By default, a checkmark icon is used to show selected items. To configure this behavior, you can use the showSelectedIcon and selectedIcon fields.

Individual segments can be enabled or disabled with their ButtonSegment.enabled flag. If the onSelectionChanged field is null, then the entire segmented button will be disabled, regardless of the individual segment settings.

This sample shows how to display a SegmentedButton with either a single or multiple selection.

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

This sample showcases how to customize SegmentedButton using SegmentedButton.styleFrom.

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

See also:



SegmentedButton({Key? key, required List<ButtonSegment<T>> segments, required Set<T> selected, void onSelectionChanged(Set<T>)?, bool multiSelectionEnabled = false, bool emptySelectionAllowed = false, ButtonStyle? style, bool showSelectedIcon = true, Widget? selectedIcon})
Creates a const SegmentedButton.


emptySelectionAllowed bool
Determines if having no selected segments is allowed.
hashCode int
The hash code for this object.
no setterinherited
key Key?
Controls how one widget replaces another widget in the tree.
multiSelectionEnabled bool
Determines if multiple segments can be selected at one time.
onSelectionChanged → (void Function(Set<T>)?)
The function that is called when the selection changes.
runtimeType Type
A representation of the runtime type of the object.
no setterinherited
segments List<ButtonSegment<T>>
Descriptions of the segments in the button.
selected Set<T>
The set of ButtonSegment.values that indicate which segments are selected.
selectedIcon Widget?
An icon that is used to indicate a segment is selected.
showSelectedIcon bool
Determines if the selectedIcon (usually an icon using Icons.check) is displayed on the selected segments.
style ButtonStyle?
Customizes this button's appearance.


createElement() StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
createState() State<SegmentedButton<T>>
Creates the mutable state for this widget at a given location in the tree.
debugDescribeChildren() List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
toString({DiagnosticLevel minLevel =}) String
A string representation of this object.
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a string representation of this node and its descendants.
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a one-line detailed description of the object.
toStringShort() String
A short, textual description of this widget.


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

Static Methods

styleFrom({Color? foregroundColor, Color? backgroundColor, Color? selectedForegroundColor, Color? selectedBackgroundColor, Color? disabledForegroundColor, Color? disabledBackgroundColor, Color? shadowColor, Color? surfaceTintColor, double? elevation, TextStyle? textStyle, EdgeInsetsGeometry? padding, Size? minimumSize, Size? fixedSize, Size? maximumSize, BorderSide? side, OutlinedBorder? shape, MouseCursor? enabledMouseCursor, MouseCursor? disabledMouseCursor, VisualDensity? visualDensity, MaterialTapTargetSize? tapTargetSize, Duration? animationDuration, bool? enableFeedback, AlignmentGeometry? alignment, InteractiveInkFeatureFactory? splashFactory}) ButtonStyle
A static convenience method that constructs a segmented button ButtonStyle given simple values.