If you ever used Google Maps on mobile or accessed from a desktop, you must have definitely typed in some location into the search bar and selected one of its results. The result might have had fields such as an address, phone numbers, ratings, timings, etc. Moreover, if you ever searched for a place on google.com from a desktop, you must have got many search results along with a place card with the aforementioned parameters aligned from the right. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Kotlin language. 

Both the applications implement a single API, which publicly is known as the Places API. Autocomplete bar is a feature of Places API, that recommends a list of locations based on the words typed by the user in the search bar. With the help of Places API, we will implement the AutocompleteBar and fetch information of the location.

Step by Step Implementation

Step 1: Create a New Project in Android Studio

To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. We demonstrated the application in Kotlin, so make sure you select Kotlin as the primary language while creating a New Project.

Step 2: Get and hide the API key

Our application utilizes Google’s Places API to implement the Autocomplete Bar, so we need to get the Places API key from Google. To get an API key, please refer to Generating API Keys For Using Any Google APIs. Hiding an API key is essential and to do so, please refer to How to Hide API and Secret Keys in Android Studio?.

Step 3: Adding the dependency in the build.gradle file

We need to import libraries that support the implementation of our Autocomplete Bar. As Autocomplete Bar is a feature of Places API, we need to append its latest dependency in the build.gradle file. The below is the dependency which must be added.

implementation ‘com.google.android.libraries.places:places:2.4.0’

Step 4: Add internet permission in your Manifest file

Navigate to the app > manifest folder and write down the following permissions to it. 

<!–Internet permission and network access permission–>

<uses-permission android:name=”android.permission.INTERNET”/>

Step 5: Implementing Autocomplete Bar fragment in the activity_main.xml file (front-end)

Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file. 

Step 6: Working with MainActivity.kt (back-end)

What we did in short is:

1. Fetched the API key that we stored in Step 2.
2. Initialized the Places API with the use of the API key.
3. Initialized the Autocomplete fragment in the layout (activity_main.xml).
4. Declared the location parameters which we wish to get from the API.
5. Declared on select listener event, which posts the parameters in the text view in the layout when the location is clicked from the autocomplete bar results.

onError function is a member function of the select listener, which will throw a toast message “Some error occurred” in the event of failure. A general cause could be the unavailability of the internet. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.

Output:

Note: Turn the Internet (Wifi/Mobile Data) on before launching the application.