Skip to content
Branch: master
Find file History
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
.idea
.vscode
example
lib Updating responseive_scaffold Mar 15, 2019
screenshots
.gitignore
.metadata
CHANGELOG.md
LICENSE
README.md
floating_search_bar.iml
pubspec.yaml floating_app_bar => desktop aware Apr 6, 2019

README.md

Buy Me A Coffee Donate

floating_search_bar

A Search App Bar like the one in Gmail and Google Photos.

Getting Started

If you want to just use the floating bar as an app bar please use SliverFloatingBar otherwise use FloatingSearchBar.

search

if you add a drawer the menu icon will show up:

drawer

Usage

import 'package:flutter/material.dart';

import 'package:floating_search_bar/floating_search_bar.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: FloatingSearchBar.builder(
        itemCount: 100,
        itemBuilder: (BuildContext context, int index) {
          return ListTile(
            leading: Text(index.toString()),
          );
        },
        trailing: CircleAvatar(
          child: Text("RD"),
        ),
        drawer: Drawer(
          child: Container(),
        ),
        onChanged: (String value) {},
        onTap: () {},
        decoration: InputDecoration.collapsed(
          hintText: "Search...",
        ),
      ),
    );
  }
}
You can’t perform that action at this time.