StreamSplitButton class

Two buttons sharing one surface, separated by a divider.

A split button pairs a primary action with a secondary one — most often a caret that opens the options for that action. Both halves are StreamButton.icons painted on a single background, so the control reads as one pill rather than two adjacent buttons.

The background is as tall as the one a StreamButtonSize.medium StreamButton paints, and the halves paint smaller still — the surface wraps the two icons rather than their tap targets, which stay full height and overhang it. The control has no size of its own.

The design gives the control the two variants of StreamSplitButtonVariant, both filled. The surface is resolved from the same StreamButtonTheme entry the halves use, which is what keeps the two from drifting apart.

Each half keeps its own tap target, hover and press feedback, and accessibility node; the divider is decorative.

{@tool snippet}

A microphone button with a caret that opens the audio settings:

StreamSplitButton.icon(
  leadingIcon: Icon(context.streamIcons.voiceFill),
  trailingIcon: Icon(context.streamIcons.caretDown),
  leadingTooltip: 'Mute',
  trailingTooltip: 'Audio settings',
  onLeadingPressed: () => toggleMute(),
  onTrailingPressed: () => showAudioSettings(),
)

{@end-tool}

{@tool snippet}

Go destructive once the microphone is off, and flip the caret while the menu it opens is showing:

StreamSplitButton.icon(
  variant: isMuted ? StreamSplitButtonVariant.destructive : StreamSplitButtonVariant.regular,
  leadingIcon: Icon(isMuted ? icons.voiceOffFill : icons.voiceFill),
  trailingIcon: Icon(isMenuOpen ? icons.caretUp : icons.caretDown),
  onLeadingPressed: () => toggleMute(),
  onTrailingPressed: () => toggleMenu(),
)

{@end-tool}

See also:

Inheritance
Annotations
  • @experimental

Constructors

StreamSplitButton.icon({Key? key, required Widget leadingIcon, required Widget trailingIcon, VoidCallback? onLeadingPressed, VoidCallback? onTrailingPressed, StreamSplitButtonVariant variant = .regular, String? leadingTooltip, String? trailingTooltip, StreamSplitButtonStyle? themeStyle})
Creates a split button with an icon in each half.

Properties

hashCode → int
The hash code for this object.
no setterinherited
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
props → StreamSplitButtonProps
The props controlling the appearance and behavior of this split button.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited

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.
inherited
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, 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