Nerd For Tech
Published in

Nerd For Tech

Integrate Google Maps In Android Dialog

Get Pinned Location Weather using Google Maps & Open Weather API.

Photo by GeoJango Maps on Unsplash

🚀 Hi, In this article we are going to integrate Google Maps into an Android Dialog. We will build an app where users will pin a location from the dialog screen and show the current weather of that area using Open Weather API.

In Hurry! Here’s the project link for you.

Let's dive in.

First Lets get API keys for google maps and open weather API.

  1. Get an API Key — Google Maps
  2. Get an API Key — Open Weather API

For simplicity, this tutorial is made with Java — Android & using Retrofit & RxJava

Project Structure

Project Structure

I assume we have both maps & weather API keys. Copy your API keys and add the BASE_URL & WEATHER_API_KEY to the (build.gradle) BuildConfig

BASE_URL == https://api.openweathermap.org/
Add Base URL & weather API KEY

Then, To add your maps API Key

In your local.properties add MAPS_API_KEY

MAPS_API_KEY=AIzaSyBoOA6wz0XayigGxsR7sA0TdpVeo1hpiOo
Maps API Key

To export these MAPS_API_KEY into our application, Add these to your build.gradle (App Module)

plugins {
id 'com.android.application'
id 'com.google.secrets_gradle_plugin' version '0.5'
}implementation 'com.google.android.gms:play-services-maps:17.0.1'
implementation 'com.google.android.gms:play-services-location:18.0.0'

And add these to your AndroidManifest.xml inside the application tag.

<meta-data
android:name="com.google.android.gms.version"
android:value="@integer/google_play_services_version" />

<meta-data
android:name="com.google.android.geo.API_KEY"
android:value="${MAPS_API_KEY}" />

Now, All Credentials setup is complete.

Source: Giphy

Let's integrate Google maps in our dialog. Before that lets create API Service for our Open Weather API.

WeatherApiService

public interface WeatherApiService {

@Headers("x-api-key: " + BuildConfig.WEATHER_API_KEY)
@GET("data/2.5/forecast")
Observable<WeatherData> requestWeather(
@Query("lat") String lat, @Query("lon") String lon, @Query("units") String units, @Query("cnt") String count
);

}

Where WeatherData is autogenerated model for our application from Open Weather API response. See Model

Now, Let's create a controller to call our Open Weather API.

WeatherController.java

Now, It's time to integrate google maps into our dialog fragment.

First, We need these permissions to make our map view work.

<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

To get pinned location latitude & longitude we create a simple interface.

public interface OnLocationSelectedListener {
void onLocationSelected(Double lat, Double lng);
}

And We can get device location from FusedLocationProviderClient.

private FusedLocationProviderClient fusedLocationProviderClient;

fusedLocationProviderClient = LocationServices.getFusedLocationProviderClient(getActivity());

Here’s how I did my setup.

That’s all. Grab the source code from below.

Thank you.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store