Welcome back.
We created the geocode address function that takes three parameters context, address and on result.
End result is a lambda expression taking lat long into a parameter and returns nothing.
Also we created the four variables search, query, location, address, and coroutine scope.
We use the location and address variables.
Now let's use search query and coroutine scope.
Let's design the user interface for the geocoding um panel.
So here under the scope of Google Map, if you go up this is the scope of Google Map.
Scroll down.
Let's create that geocoding overlay which is a search bar starting with column.
Set the modifier equals to modifier align alignment dot bottom start.
Then inside the scope of this column.
Create a text field value equals to search query on value change which is search query equals to it.
Placeholder text enter address the modifier fill maximum width.
Then create a search button on.
Click create a coroutine scope.
Use it to coroutine scope dot launch and inside the launch and the coroutine scope, we need to fetch
the geocoding and the location.
So location variable equals to geocode address.
This is the function that we created before.
And we need to pass the context the search query.
And the last parameter is the lambda expression.
The lambda expression that we created before takes a lat long as a parameter and returns nothing.
So here I need to define lat long my or location lat long.
Check for the location.
If it is not null, then let location location lat long.
If it is not null, then what we need to do?
We need to move the camera position state to the newly created one using the camera position function
dot from lat long, zoom it and 15.
Then set the modifier fill maximum width and inside the row scope.
Set the text search.
There is a very important note here, since we are using the coroutine scope to do the job of searching,
query and search the address and get it back.
We need to wrap it inside dispatchers.
So here if you hover the mouse you get type mismatch required lambda expression found a job and to solve
it.
It's very simple.
Here on click are returning a job instead of a lambda expression.
It's very simple using like this.
And here wrapping it inside this okay so this is the lambda expression that we create here.
The second step is to remove the location because here we don't expect returning anything okay.
It's very simple here we created a coroutine and we used this function to make the geocoding.
Then scroll down.
We set this text to the search and let me display the address in a text.
So display create a new composable okay let me run.
Now here we go.
This is our search bar I need to move this text because it's under and behind this surface.
Let me move it.
Cut.
Scroll up and here above the text field, make this text and let me add some margin and padding padding
from bottom.
Set it to for example, 60 dpi.
Run the application again.
Take the effect.
It's better now that text is visible.
Now let's enter the address here.
Um.
Let me start with Eiffel Tower.
Click search and here we go.
We are in Paris, so that map directs us to the current location of Eiffel Tower.
Let me try another thing.
Statue of Liberty.
Click search.
And here we go.
This is the Statue of Liberty that we have in New York and New Jersey.
Okay.
So this is how we use geocoding.