Zachary Powell

Software Programmer

Zachary Powell

Download my CV Send me a Message

Using Google Maps within Android app

Zachary Powell - 11/12/2015

Don’t worry, there is a pattern to my posts, honestly! All will become clear further down the line.

Google has a range of great APIs and extras, and one that comes in pretty handy from time to time, is the Google Maps API. This allows you to display a custom Google Map within your own application. This is useful if you have any location based information you might want to display *cough* buildings *cough*

Google actually has a pretty good guide on the subject over at https://developers.google.com/maps/documentation/android-api/start. Do check it out, Though, I will cover all your need below and its worth a read for extra tips and hints!

Set up

For this (and all Android) guide we will be using Android studio. It is now the only supported IDE by Google and has come a long way in the few years its been in development. If you are not already using it, download and install Android Studio now.

Next, (again if you have not already) make sure to install the Google Play services package into the Android SDK, details of this are to be found HERE.

Creating Activity that displays map

Screen Shot 2015-12-08 at 13.43.43

The easiest way to create a new activity that displays a Google Map is by using Android studios built in “New Activity” menu. As long as you have the above set up correctly, you will see in this list the option for a “Google Map Activity”. This will create all the files needed and handle the basic set up. Now that is all well and good, but lets actually have a look at what is created and what the code that has been generated does.

MapsActivity.java

The activity file that handles the actual code, the generated code:

public class MapsActivity extends FragmentActivity implements OnMapReadyCallback {

    private GoogleMap mMap;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_maps);
        // Obtain the SupportMapFragment and get notified when the map is ready to be used.
        SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }
    
    @Override
    public void onMapReady(GoogleMap googleMap) {
        mMap = googleMap;

        LatLng sydney = new LatLng(-34, 151);
        mMap.addMarker(new MarkerOptions().position(sydney).title("Marker in Sydney"));
        mMap.moveCamera(CameraUpdateFactory.newLatLng(sydney));
    }
}

As you can see, the code required is actually pretty minimal to get a map displayed. The main code that is important is within the onCreate() method. Here we set up the MapFragment view and then fire off the fragments getMapAsync() method. This handles the background code to actually connect to the Google Map API and load a new map.

The onMapReady() method then takes care of any post processing we want to do on the Map. Here we set up the private GoogleMap variable to allow us to manipulate the Map from other methods within our activity.

We then set up an example LatLng object. We are using Sydney, but of course it could be any location in the world.

LatLng sydney = new LatLng(-34, 151);

Then we add a basic marker to the map at the created location.

mMap.addMarker(new MarkerOptions().position(sydney).title("Marker in Sydney"));

And finally we move the screen to focus to that location.

        mMap.moveCamera(CameraUpdateFactory.newLatLng(sydney));

activity_map.xml

This is the fragment view for the map, again very simple.

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/map"
    android:name="com.google.android.gms.maps.SupportMapFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.zpwebsites.basicgooglemapexample.MapsActivity" />

Nothing special about this as we insert the map into the fragment from code.

google_map_api.xml

<resources>
    <string name="google_maps_key" templateMergeStrategy="preserve" translatable="false">YOUR_KEY_HERE</string>
</resources>

This is the final file created. Here is where we need to insert out API Key from Google to allow us to talk to the Google Map server and actually display a map.

Getting API Key

So now we have a very basic app ready to run, but if you try to run the app as it is, the map will not load. We need to get a API Key from Google to allow us to display the map.

To get this set up, follow the steps in the Google Guide HERE

Complete Example

Once you have added the key to your google_map_api.xml, you should now be able to run the application and see a map.

If you would like to checkout the complete applications code you can find it HERE. This code will be updated in the future to hold all example code for Google Maps.

As always if you have any questions please comment below.

Leave a Comment

Leave a Reply

Your email address will not be published. Required fields are marked *

Tags: , ,

“ Any fool can write code that a computer can understand. Good programmers write code that humans can understand. ”

-Martin Fowler