Go to Qiita Advent Calendar 2024 Top
LoginSignup
56
48

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

@rkonnoin岩手県立大学

Androidアプリ開発でGoogleMapを利用する

Posted at

GoogleMapを利用したアプリを作ってみるチュートリアル

Androidアプリ開発で、GoogleMapを利用したことがないAndroidアプリ開発入門者向けの記事です。

対象読者

手順

  1. Google Play servicesライブラリのインストール
  2. サンプルアプリのプロジェクト作成
  3. Google Play servicesライブラリのインポート
  4. APIアクセスキーの取得
  5. APIアクセスキー、各permissionの追加
  6. 実際にマップを表示するアプリを実装する

Google Play servicesライブラリのインストール

Google Play servicesをインストールします。

Android Studioを起動し、メニューから

Tools > Android > SDK Manager > Launch Standalone SDK Manager

を選択し、SDK Managerを立ち上げます。

https://gyazo.com/62b26294fe53a7b000bee0e0082e15bd

Packagesの一覧が表示されたら、一番下のExtraの中にあるGoogle Play servicesを選択し、install packages...する。

https://gyazo.com/945bc6b859010b88f1245d80bcdc29a6

これで、Google Play servicesライブラリのインストールは完了です。

サンプルアプリのプロジェクト作成

Android Studioのメニューから

File > New > New Project...

を選択し、CreateNewProjectウィンドウが立ち上がったら、

  • Application Name : SampleMaps（任意の名前）
  • その他はデフォルトのまま

でNextで次へ。

Target Android Devicesについては、

  • Minimum SDK : 実機のAndroidOSに合わせる

Nextで次へ。

Activityの種類については、Empty Activityにする。

Nextで次へ。

Customize the Activityは、デフォルトのまま。

ひとまず、プロジェクトができます。

Google Play servicesライブラリのインポート

先ほど作った、SampleMapsのAndroid Studioのメニューから、

File > Project Structure

を選択します。

https://gyazo.com/f96504af2f67d80c499f58580fc143a1

ProjectStructureが立ち上がったら、右側のModulesのappを選択します。

上部タブのDependenciesを選択します。

ウィンドウ下部左側の➕からLibrary Dependencyを選択します。

https://gyazo.com/eca480328df5dd3930924b1f296506e0

play-servicesを選択し、OK。

これでこのプロジェクトにおいて、Google Play servicesライブラリをインポートすることができました。

APIアクセスキーの取得

ここから一旦AndroidStudioの作業からは離れて、APIアクセスキーの取得を行います。

Google Maps Android APIを利用するためのAPIを取得に関しては、SHA-1フィンガープリントが必要となります。

SHA-1フィンガープリントとは、APIアクセスキーを利用する自分の環境を証明するためのもの。SHA-1とは、データの改ざん検知などに使われるハッシュ関数の一つで、フィンガープリントとは、このハッシュ関数から得られたハッシュ値のこと。

SHA-1を調べる

Windowsの場合

コマンドプロンプトで

cd "(JDKのbinディレクトリ)"

のディレクトに移動し、（JDKのバージョンによってPathが異なる）

keytool -list -v -keystore "C:¥Users¥{Your account name}¥.android¥debug.keystore" -alias androiddebugkey -storepass android -keypass android"

で、表示されます。

MacOSの場合

Terminalで、

keytool -v -list -keystore ~/.android/debug.keystore

で表示されます。

キーストアのパスワードを入力してください:には何も入力せず、Enter。

すると、以下のとおりSHA-1のフィンガープリントが得られます。

証明書のフィンガプリント:
	 MD5:  12:34:56:78:90:AB:CD:EF:12:34:56:78:90:AB:CD:EF:AA:BB:CC:DD
	 SHA1: 12:34:56:78:90:AB:CD:EF:12:34:56:78:90:AB:CD:EF:AA:BB:CC:DD ←これがSHA-1フィンガープリント

今後必要となるので、SHA-1フィンガープリントをひかえます。

Google Developers ConsoleでAPIアクセスキーを取得する

次に、Google Developers Consoleに、ブラウザからアクセスし、任意のGoogleアカウントでサインインします。

プロジェクトを作成 > 任意のプロジェクト名を入力し作成を選択。

ダッシュボードに遷移したら、青いGoogleAPIを利用するカードを選択。

https://gyazo.com/0dced1774fee30c70d358f6506bf8299

GoogleAPIタブから、

Google Maps APIのGoogle Maps Android APIを選択。

https://gyazo.com/633bb47c97b3112278234b195a70d76b

APIを有効にする を選択。

すると、この API は有効になっていますが、...という警告が出てくるので、

認証情報に進むを選択。

プロジェクトへの認証情報の追加が開いたら、

  • 使用する API：GoogleMapsAndroidAPI
  • APIを呼び出す場所：Android

で、必要な認証情報を選択。

完了したら、キャンセルで認証情報ページに遷移する。

真ん中のカードの新しい認証情報ボタンを選択し、

APIキー > Androidキー

https://gyazo.com/eb08fa2eff54dc450c03b8aa98d195e4

https://gyazo.com/788b49e6b5ba484e38db39d2ec616049

を選択する。Android API キーの作成ページでは、

https://gyazo.com/fd05ef40175fea9fdaf66149ab0b1f6d

名前は任意のもので、

➕ パッケージ名とフィンガープリントを追加

を選択し、

  • 先ほど作ったSampleMapのパッケージ名
  • ひかえていたSHA-1 証明書のフィンガープリント

を入力し、作成を選択。

すると、APIキーが発行されるのでひかえます。

https://gyazo.com/ecb38e821e606b8e5615b831bab86bee

APIアクセスキー、各permissionの追加

Android StudioのSampleMapプロジェクトに戻って、AndroidManifest.xmlにパーミッション関連、APIアクセスキーを記述します。

https://gyazo.com/4a8936400e9e3c1367679c8a68de00cb

AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.hoge.samplemap">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES" />

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <meta-data
            android:name="com.google.android.gms.version"
            android:value="@integer/google_play_services_version" />
        <meta-data
            android:name="com.google.android.maps.v2.API_KEY"
            android:value="APIキーを入力する" />

    </application>
</manifest>

変更点は以下の赤枠で囲った部分です。

https://gyazo.com/613fef1fdc82bb92b6b52202a4777b94

user-permissionは、マップを利用する上で必要なパーミッションを記述しています。
meta-dataの１つ目は、play-servicesを利用するための指定、２つ目は、さきほど取得したAPIキーを指定しています。

これで、プロジェクトでGoogle Maps Android API v2が利用できるようになりました。

実際にマップを表示するアプリを実装する

パーミッションとAPIキーの追加ができたので、実際にGoogleMapを表示するアプリを実装します。

MainActivity.java
package com.example.hoge.samplemap;

import android.app.FragmentManager;
import android.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.MapFragment;

public class MainActivity extends AppCompatActivity {

    MapFragment mf;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        mf = MapFragment.newInstance();

        FragmentManager fm = getFragmentManager();
        FragmentTransaction ft = fm.beginTransaction();
        ft.add(android.R.id.content, mf);
        ft.commit();
    }
}

https://gyazo.com/1f2386d7816739898212792cf76e2691

無事、APIにアクセスできているのが確認できました。
※ここで、左下にGoogleロゴが表示されているが、マップが表示されない状況は、APIキーが間違っている可能性があります。

Google Maps Android API v2 のマップを利用するために、マップフラグメント（MapFragment）クラスを用います。

  1. MapFragmentのオブジェクトをnewInstance()メソッドで生成
  2. FragmentManagerクラスで管理オブジェクトFragmentManagerを取得
  3. beginTransaction()メソッドでフラグメント管理を開始
  4. add()メソッドで追加
  5. commit()メソッドでフラグメント管理を反映

という手順を踏んで実装します。

以上です。

56
48
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
56
48

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?