CustomSearchBar class

A highly customizable search bar widget with extensive configuration options.

Features:

  • Multiple style presets (outlined, filled, underline, rounded, pill)
  • Configurable appearance (colors, sizes, borders, icons)
  • Search debouncing to prevent excessive API calls
  • Clear button with animation
  • Voice search support (optional)
  • Loading state indicator
  • Error state styling
  • Full accessibility support
  • Security validation for input

Example usage:

CustomSearchBar(
  style: SearchBarStyle.rounded,
  hintText: 'Search products...',
  onSearch: (query) => performSearch(query),
  onChanged: (value) => print(value),
  showClearButton: true,
  debounceMs: 300,
)
Inheritance

Constructors

CustomSearchBar({Key? key, TextEditingController? controller, FocusNode? focusNode, void onChanged(String)?, void onSearch(String)?, void onSubmitted(String)?, VoidCallback? onTap, VoidCallback? onClear, void onFocusChanged(bool)?, VoidCallback? onVoiceSearch, SearchBarStyle style = SearchBarStyle.outlined, SearchBarAnimationType animationType = SearchBarAnimationType.fade, double? height, double? width, EdgeInsetsGeometry? padding, EdgeInsetsGeometry? contentPadding, EdgeInsetsGeometry? margin, double? borderRadius, double? borderWidth, double? iconPaddingLeft, double? iconPaddingRight, double? iconSpacing, Color? backgroundColor, Color? focusedBackgroundColor, Color? disabledBackgroundColor, Color? borderColor, Color? focusedBorderColor, Color? errorBorderColor, Color? textColor, Color? hintColor, Color? iconColor, Color? focusedIconColor, Color? disabledIconColor, Color? cursorColor, Color? shadowColor, Color? clearButtonColor, Color? clearButtonBackgroundColor, Color? loadingIndicatorColor, Widget? prefixIcon, Widget? suffixIcon, IconData? prefixIconData, IconData? suffixIconData, double? prefixIconSize, double? suffixIconSize, bool showPrefixIcon = true, bool showClearButton = true, bool showVoiceButton = false, Widget? clearIcon, Widget? voiceIcon, double? clearIconSize, IconData? voiceIconData, String? hintText, TextStyle? textStyle, TextStyle? hintStyle, double? fontSize, FontWeight? fontWeight, String? fontFamily, int? maxLength, TextInputType? keyboardType, TextInputAction? textInputAction, TextCapitalization? textCapitalization, bool autofocus = false, bool readOnly = false, bool enabled = true, bool enableSuggestions = true, bool autocorrect = true, int? debounceMs, bool hapticFeedback = true, bool closeKeyboardOnSubmit = true, bool clearOnSubmit = false, bool selectAllOnFocus = false, bool isLoading = false, bool hasError = false, String? errorText, TextStyle? errorTextStyle, EdgeInsetsGeometry? errorTextPadding, Duration? animationDuration, Curve? animationCurve, double? elevation, double? focusedElevation, Widget? loadingWidget, double? loadingIndicatorSize, double? loadingIndicatorStrokeWidth, double? clearButtonPadding, BoxShape? clearButtonShape, List<TextInputFormatter>? inputFormatters, Iterable<String>? autofillHints, String? semanticLabel, bool? enableSecurity})
const

Properties

animationCurve → Curve?
final
animationDuration → Duration?
final
animationType → SearchBarAnimationType
final
autocorrect → bool
final
autofillHints → Iterable<String>?
final
autofocus → bool
final
backgroundColor → Color?
final
borderColor → Color?
final
borderRadius → double?
Border radius of the search bar
final
borderWidth → double?
Border width
final
clearButtonBackgroundColor → Color?
final
clearButtonColor → Color?
final
clearButtonPadding → double?
Padding inside the clear button
final
clearButtonShape → BoxShape?
Shape of the clear button background
final
clearIcon → Widget?
Custom clear icon widget
final
clearIconSize → double?
Size of the clear icon (ratio of suffix icon size)
final
clearOnSubmit → bool
Whether to clear text on submit
final
closeKeyboardOnSubmit → bool
Whether to close keyboard on submit
final
contentPadding → EdgeInsetsGeometry?
Padding inside the search bar
final
controller → TextEditingController?
final
cursorColor → Color?
final
debounceMs → int?
Debounce duration in milliseconds for search callback
final
disabledBackgroundColor → Color?
final
disabledIconColor → Color?
final
elevation → double?
final
enabled → bool
final
enableSecurity → bool?
final
enableSuggestions → bool
final
errorBorderColor → Color?
final
errorText → String?
Error text to display
final
errorTextPadding → EdgeInsetsGeometry?
Padding for error text
final
errorTextStyle → TextStyle?
Style for error text
final
focusedBackgroundColor → Color?
final
focusedBorderColor → Color?
final
focusedElevation → double?
final
focusedIconColor → Color?
final
focusNode → FocusNode?
final
fontFamily → String?
final
fontSize → double?
final
fontWeight → FontWeight?
final
hapticFeedback → bool
Whether to trigger haptic feedback on actions
final
hasError → bool
Whether the search bar is in error state
final
hashCode → int
The hash code for this object.
no setterinherited
height → double?
Height of the search bar
final
hintColor → Color?
final
hintStyle → TextStyle?
final
hintText → String?
Hint text (placeholder)
final
iconColor → Color?
final
iconPaddingLeft → double?
Padding on the left side of icons
final
iconPaddingRight → double?
Padding on the right side of icons
final
iconSpacing → double?
Spacing between suffix icons
final
inputFormatters → List<TextInputFormatter>?
final
isLoading → bool
Whether the search is currently loading
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
keyboardType → TextInputType?
final
loadingIndicatorColor → Color?
final
loadingIndicatorSize → double?
Size of the loading indicator
final
loadingIndicatorStrokeWidth → double?
Stroke width of the loading indicator
final
loadingWidget → Widget?
Custom loading widget
final
margin → EdgeInsetsGeometry?
Margin around the search bar
final
maxLength → int?
final
onChanged → void Function(String)?
Called when the search text changes
final
onClear → VoidCallback?
Called when clear button is pressed
final
onFocusChanged → void Function(bool)?
Called when focus state changes
final
onSearch → void Function(String)?
Called when search is submitted (with debounce)
final
onSubmitted → void Function(String)?
Called when user submits via keyboard action
final
onTap → VoidCallback?
Called when search bar is tapped
final
onVoiceSearch → VoidCallback?
Called when voice search button is pressed
final
padding → EdgeInsetsGeometry?
Padding around the search bar container
final
prefixIcon → Widget?
Custom prefix icon widget
final
prefixIconData → IconData?
Icon data for prefix (used if prefixIcon is null)
final
prefixIconSize → double?
Size of prefix icon
final
readOnly → bool
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
selectAllOnFocus → bool
Whether to select all text when focused
final
semanticLabel → String?
final
shadowColor → Color?
final
showClearButton → bool
Whether to show clear button when text is present
final
showPrefixIcon → bool
Whether to show prefix icon
final
showVoiceButton → bool
Whether to show voice search button
final
style → SearchBarStyle
final
suffixIcon → Widget?
Custom suffix icon widget
final
suffixIconData → IconData?
Icon data for suffix (used if suffixIcon is null)
final
suffixIconSize → double?
Size of suffix icon
final
textCapitalization → TextCapitalization?
final
textColor → Color?
final
textInputAction → TextInputAction?
final
textStyle → TextStyle?
final
voiceIcon → Widget?
Custom voice icon widget
final
voiceIconData → IconData?
Icon data for voice button
final
width → double?
Width of the search bar (null = full width)
final

Methods

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