How to make text input with dropdown suggestions using Flutter

Question

I have just begun using Flutter to create a mobile app.

The first thing I need the app to do is to take an Address/location as input from the user.

I would like to use a text input field that once you start typing it suggests locations based on the google place API.

Sadly there is no widget to enable this out of the box, but it shouldn't be so hard to do. Google's places API returns results based on any text input, so you can just keep sending keystrokes until the user sees (and selects) their desired location. I've got the API working already.

Now I'm struggling with how to build the front end experience.

I was hoping to have a drop-down text field, but I'm not finding anything similar in the widget library.

My next best idea was an input field with a DropdownButton class next to it. I want to make the DropdownButton invisible (0 width) but programmatically make it drop down once the user begins typing.

Sadly I don't see any way to control the visibility of the Dropdown List, so I'm not sure this will work.

Does anyone have any better ideas?

Image of what I have so far but obviously this is not optimal:

Answer 1

It's probably late for an answer but I'll still post this in case anyone else is still curious about this.

If you have the API wired up then what might prove useful is this third-party package.

It's called Flutter Typeahead.

It's a generic input with dropdowns and the data can come from any API and not just the Google Places API.