GF SearchBar

GF SearchBar represent a text field that can be used to search through a collection.

GF Searchbar
​
GF SearchBar contains textfield for user input and the overlay container to show the search list collections.
Usage
The simple code of a basic GFSearchBar is as shown below.
import 'package:getflutter/getflutter.dart';
​
List list = [
    "Flutter",
    "React",
    "Ionic",
    "Xamarin",
  ];
​
GFSearchBar(
  searchList: list,
  searchQueryBuilder: (query, list) {
    return list
        .where((item) =>
            item.toLowerCase().contains(query.toLowerCase()))
        .toList();
  },
  overlaySearchListItemBuilder: (item) {
    return Container(
      padding: const EdgeInsets.all(8),
      child: Text(
        item,
        style: const TextStyle(fontSize: 18),
      ),
    );
  },
  onItemSelected: (item) {
    setState(() {
      print('$item');
    });
  },
),
Look and feel of the GFSearchBar can be customized using the GFSearchBar properties.
Search Bar with Results
Custom Properties
Name
Description
searchList
List of [text] or [widget] reference for users
overlaySearchListItemBuilder
defines how the [searchList] items look like in overlayContainer
hideSearchBoxWhenItemSelected
if true, it will hide the [searchBox]
overlaySearchListHeight
defines the height of [searchList] overlay container
searchQueryBuilder
can search and filter the [searchList]
noItemsFoundWidget
displays the [widget] when the search item failed
onItemSelected
defines what to do with onSelect [SearchList] item
searchBoxInputDecoration
defines the input decoration of [searchBox]

GF Appbar

GF Rating

Last updated 4 months ago

Name	Description
searchList	List of [text] or [widget] reference for users
overlaySearchListItemBuilder	defines how the [searchList] items look like in overlayContainer
hideSearchBoxWhenItemSelected	if true, it will hide the [searchBox]
overlaySearchListHeight	defines the height of [searchList] overlay container
searchQueryBuilder	can search and filter the [searchList]
noItemsFoundWidget	displays the [widget] when the search item failed
onItemSelected	defines what to do with onSelect [SearchList] item
searchBoxInputDecoration	defines the input decoration of [searchBox]