Search Bar in Flutter

Greg Perry
CodeChai
Published in
8 min readJan 25, 2020

--

Another variation in a common feature.

Apps love their search bars. Every popular platform has a dedicated class to provide a search bar — all except Flutter it would seem. A search bar offers a means for the user to quickly search for content applicable to the app being used. Many articles have been written on the subject offering code that implements a search bar of one variation or another. Frankly, this article is no exception. Inspired by Ahmed Al-Zahrani’s own article, A simple Search Bar in Flutter, I wrote a class that supplies yet another search bar for Flutter. The source code is available to you to do what you will. Make it your own. Make it better — and share if you’re so inclined.

This article will examine my version’s implementation and how it’s used. The article will supply some examples, and we’ll do a ‘walk through’ the code.

Screenshots Only. Click For Gists.

As always, I prefer using screenshots over gists to show concepts rather than just show code in my articles. I find them easier to work with frankly. However, you can click or tap on these screenshots to see the code they represent in a gist or in Github. Ironically, it’s better to read this article about mobile development on your computer than on your phone. Besides, we program on our computers — not on our phones. For now.

No Moving Pictures No Social Media

--

--