ducafecatFlutter ecosystem guide
GitHub repositoryDev-hwang/outline_search_bar

outline_search_bar

This package allows you to create an outlined Material design search bar.

View on GitHub ↗
outline_search_bar project cover
Stars
7
Forks
7
Last push (UTC)
Aug 2, 2023
Project status
Active

Original README

English project snapshot. Visit GitHub for the latest content.

This package allows you to create an outlined Material design search bar.

pub package

Screenshots

Getting started

To use this package, add outline_search_bar as a dependency in your pubspec.yaml file. For example:

dependencies:
  outline_search_bar: ^2.3.0

OutlineSearchBar

Parameter Description
textEditingController The keyword of OutlineSearchBar can be controlled with a TextEditingController.
keyboardType Set keyboard type.
Default value is TextInputType.text.
textInputAction Set keyboard action.
Default value is TextInputAction.search.
maxHeight Set the maximum height of OutlineSearchBar.
icon Set the icon of OutlineSearchBar.
backgroundColor Set the color of OutlineSearchBar.
Default value is Theme.of(context).scaffoldBackgroundColor.
borderColor Set the border color of OutlineSearchBar. If value is null and theme brightness is light, use primaryColor, if dark, use accentColor.
borderWidth Set the border thickness of OutlineSearchBar.
Default value is 1.0.
borderRadius Set the border radius of OutlineSearchBar.
Default value is const BorderRadius.all(const Radius.circular(4.0)).
margin Set the margin value of OutlineSearchBar.
Default value is const EdgeInsets.only().
padding Set the padding value of OutlineSearchBar.
Default value is const EdgeInsets.symmetric(horizontal: 5.0).
textPadding Set the text padding value of OutlineSearchBar.
Default value is const EdgeInsets.symmetric(horizontal: 5.0).
elevation Set the elevation of OutlineSearchBar.
Default value is 0.0.
initText Set the keyword to be initially entered. If initial text is set in textEditingController, this value is ignored.
hintText Set the text to be displayed when the keyword is empty.
textStyle Set the input text style.
hintStyle Set the style of hintText.
maxLength Set the maximum length of text to be entered.
cursorColor Set the color of cursor.
cursorWidth Set the width of cursor.
Default value is 2.0.
cursorHeight Set the height of cursor.
cursorRadius Set the radius of cursor.
clearButtonColor Set the background color of the clear button.
Default value is const Color(0xFFDDDDDD).
clearButtonIconColor Set the icon color inside the clear button.
Default value is const Color(0xFFFEFEFE).
searchButtonSplashColor Set the splash color that appears when the search button is pressed.
searchButtonIconColor Set the icon color inside the search button. If value is null and theme brightness is light, use primaryColor, if dark, use accentColor.
searchButtonPosition Set the position of the search button. Default value is SearchButtonPosition.trailing.
debounceDelay The delay between when the user stops typing a keyword and receives the onTypingFinished event.
Default value is 500.
autoCorrect Whether to use autoCorrect option.
Default value is false.
enableSuggestions Whether to use enableSuggestions option.
Default value is true.
hideSearchButton Whether to hide the search button.
Default value is false.
ignoreWhiteSpace Whether to ignore input of white space.
Default value is false.
ignoreSpecialChar Whether to ignore input of special characters.
Default value is false.
onTap Called when OutlineSearchBar is tapped.
onKeywordChanged Called whenever a keyword is changed.
onTypingFinished Called when keyword typing is finished.
onClearButtonPressed When the clear button is pressed, it is called with the previous keyword.
onSearchButtonPressed When the search button is pressed, it is called with the entered keyword.

Support

If you find any bugs or issues while using the plugin, please register an issues on GitHub. You can also contact us at <hwj930513@naver.com>.

Dev-hwang GitHub avatar
GitHub author

Dev-hwang ↗

Android & Flutter developer

-Republic of Korea
LanguagesDart

Categories

# flutter# android# ios# web# search-bar

Packages published by this repository

Dependencies used

Dependency list 4 items

  • flutter{"sdk":"flutter"}
  • simple_text_field^2.1.0
  • flutter_testDevelopment{"sdk":"flutter"}
  • flutter_lintsDevelopment^1.0.0

How do I choose a repository?

Start with your use case, compare repository activity, and check the original project before adopting it.

  1. Search by repository name, owner or description, then narrow the results by topic.
  2. Compare stars, forks and recent pushes. Stars show community interest, not a guarantee of quality.
  3. Read the README, license and issues on GitHub before using a project.

Sources and maintenance

“A repository is the most basic element of GitHub.”

GitHub Docs — About repositories ↗