SearchBar class

A Material Design search bar.

A SearchBar looks like a TextField. Tapping a SearchBar typically shows a "search view" route: a route with the search bar at the top and a list of suggested completions for the search bar's text below. SearchBars are usually created by a SearchAnchor.builder. The builder provides a SearchController that's used by the search bar's SearchBar.onTap or SearchBar.onChanged callbacks to show the search view and to hide it when the user selects a suggestion.

For TextDirection.ltr, the leading widget is on the left side of the bar. It should contain either a navigational action (such as a menu or up-arrow) or a non-functional search icon.

The trailing is an optional list that appears at the other end of the search bar. Typically only one or two action icons are included. These actions can represent additional modes of searching (like voice search), a separate high-level action (such as current location) or an overflow menu.

This example demonstrates how to use a SearchBar as the return value of the SearchAnchor.builder property. The SearchBar also includes a leading search icon and a trailing action to toggle the brightness.
link

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

See also:

Inheritance

Constructors

Creates a Material Design search bar.
const

Properties

autoFocus bool
Whether this text field should focus itself if nothing else is already focused.
final
backgroundColor MaterialStateProperty<Color?>?
The search bar's background fill color.
final
constraints BoxConstraints?
Optional size constraints for the search bar.
final
controller TextEditingController?
Controls the text being edited in the search bar's text field.
final
elevation MaterialStateProperty<double?>?
The elevation of the search bar's Material.
final
enabled bool
If false the text field is "disabled" so the SearchBar will ignore taps.
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
hintStyle MaterialStateProperty<TextStyle?>?
The style to use for the hintText.
final
hintText String?
Text that suggests what sort of input the field accepts.
final
key Key?
Controls how one widget replaces another widget in the tree.
finalinherited
keyboardType TextInputType?
The type of action button to use for the keyboard.
final
leading Widget?
A widget to display before the text input field.
final
onChanged ValueChanged<String>?
Invoked upon user input.
final
onSubmitted ValueChanged<String>?
Called when the user indicates that they are done editing the text in the field.
final
onTap GestureTapCallback?
Called when the user taps this search bar.
final
onTapOutside TapRegionCallback?
Called when the user taps outside the search bar.
final
overlayColor MaterialStateProperty<Color?>?
The highlight color that's typically used to indicate that the search bar is focused, hovered, or pressed.
final
padding MaterialStateProperty<EdgeInsetsGeometry?>?
The padding between the search bar's boundary and its contents.
final
runtimeType Type
A representation of the runtime type of the object.
no setterinherited
shadowColor MaterialStateProperty<Color?>?
The shadow color of the search bar's Material.
final
shape MaterialStateProperty<OutlinedBorder?>?
The shape of the search bar's underlying Material.
final
side MaterialStateProperty<BorderSide?>?
The color and weight of the search bar's outline.
final
surfaceTintColor MaterialStateProperty<Color?>?
The surface tint color of the search bar's Material.
final
textCapitalization TextCapitalization?
Configures how the platform keyboard will select an uppercase or lowercase keyboard.
final
textInputAction TextInputAction?
The type of action button to use for the keyboard.
final
textStyle MaterialStateProperty<TextStyle?>?
The style to use for the text being edited.
final
trailing Iterable<Widget>?
A list of Widgets to display in a row after the text field.
final

Methods

createElement() StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() State<SearchBar>
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
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