When would you need a Custom Google Place Autocomplete?

There are many scenarios where in the  Place Autocomplete provided by google might not be of your use. These are the following two cases where in i had to create a custom Autocomplete for place search:

1) Bug in customising the UI of Place Autocomplete:

AutoCompleteTextView has white text color when setting Theme_Light programatically.

Despite of all the effort for changing the text color, it did not changed. From 2009 till now, no fix has been provided by Google for this bug. The UI experience of your user will badly be affected because of this bug. So, designing a custom Place Autocomplete would be the only thing you could do to improve the ui of your app and experience of the user.

2) Google Place Autocomplete is only available after Google Play Services 7.0:

There might be situations where in you would be using a version of Google Play Services less that 7.0. This would specially be the case when you would want your app to support devices with older play store versions. These list of devices includes Lollipop. So, if your app is supporting Lollipop then you might not be able to use Google Place Autocomplete. In such situation, the only option left with you is write your own autocomplete for searching places.

How to write your own Custom Google Place Autocomplete?

Creating your own widget to implement Place Autocomplete is very easy. You just need to make use of the Place API provided by the google.

All you need to do is to query the Place API as the user types text and update the list with the result received. This post will help you design the right query and optimising the hits and updation of UI.

First, you need to get the Place API browser key from the Google Developer Console and also enable the Google Places API Web Service. (Note: You do not need to enable the Google Places API for Android because that is used by Place Autocomplete Widget and Place Picker widget.) Go through this post that explains how to get browser key for Google APIs.

Once you have the browser key, use this key to query Google Place API. The following methods is used to build a GET query, which is the default query that is used by the Google Place AutoComplete widget.

In the above query we send the text of the autocomplete EditText with latitude and longitude of current location, radius of search, language of result data, and a browser key for Google APIs. Your final url will look like,

You now need to hit the autocomplete query as user types the content in your custom autocomplete EditText. You will build this query as the user types and will hit the server with this URL to fetch the result. But since, a network call will be made as the user types in, we need to optimise the network hits by cancelling all the previous hits and send the latest one with the new text of the EditText. For this, you need to add a TextWatcher to your EditText and override the onTextChanged method. Within the onTextChanged method, you will need to create a handler which send request with a delay of 1 second and before sending the request cancels all the pending hits. The following code shows how we will override the onTextChanged method :

Now after hitting the Google Place Autocomplete query, you will parse the result JSON and will create a list of places from the result received. A sample result will look like following:

You can now pass the result and use the data to show in a ListView below your autocomplete EditText. For example, the above data when parsed in a ListView will look like following:

Custom Google Place Autocomplete

 

A full working GitHub project for Custom Google Place Autocomplete is available at:

 https://github.com/manshachuttani/CustomPlaceAutocomplete