Xamarin逆引きTips
Xamarin.Androidで地図を表示するには？（Google Maps使用）
Androidで最も一般的な地図API「Google Maps Android API v2」を使って、Xamarin.Androidで地図を表示する方法を解説。API利用環境の準備から、まずはGoogleマップを表示するまでの手順を説明する。
Androidアプリで地図を使用する場合、最も一般的なのが「Google Maps Android API v2」（以下、「GoogleMapAPI」と表記）だ。Xamarin.Androidでも同様にこのAPIを使用する。今回から何回かに分けて、Xamarin.AndroidでGoogleマップを使用する方法を解説する。
今回は、GoogleMapAPIを導入し、地図を表示する方法を解説する。なお、対象のAndroidのバージョンは4.2（Ice Cream Sandwich）以上とする。
1. プロジェクトを作成する
メニューバーの［ファイル］－［新規］－［ソリューション］から表示したダイアログで、［C#］－［Android］－［Android Ice Cream Sandwich Application］を選択し、ソリューション名を「GoogleMapSample」として［OK］ボタンを押す。
作成されたプロジェクトのAndroidManifest.xmlファイルを開くと、次のようになっている。
|
<?xml version="1.0" encoding="utf-8"?>
<manifest
xmlns:android="http://schemas.android.com/apk/res/android"
android:versionCode="1"
android:versionName="1.0"
package="GoogleMapSample.GoogleMapSample"> <!--1-->
<uses-sdk />
<application android:label="GoogleMapSample">
</application>
</manifest>
|
1のパッケージ名GoogleMapSample.GoogleMapSampleを後で使用するので、メモしておく。
2. Google Maps Android API v2を利用するためのAPIキーを取得する
次に、GoogleMapAPIを使用するためのAPIキーを取得する。
この手順はXamarin.Androidに限ったものではなく、ネイティブの開発でも同様なので、すでに手順を知っている人は読み飛ばしていただいて構わない。ただし、Xamarin.Androidのdebug.keystoreファイルの場所はネイティブとは異なるので注意してほしい。
2-1. キーストアのフィンガープリントを取得する
Androidアプリのパッケージ（.apkファイル）への署名に使用しているキーストアは、デバッグ時はdebug.keystoreファイルが、リリース時には開発者が用意したkeystoreファイルが通常使われる。
GoogleMapAPIのAPIキーを取得するには、まずこのキーストアからSHA1のフィンガープリントを取得する必要がある。
Xamarin.Androidが使用するデバッグ用のdebug.keystoreファイルは、以下の場所にある。
- Windows： C:\Users\＜USERNAME＞\AppData\Local\Xamarin\Mono for Android\debug.keystore
- Mac OS X： /Users/＜USERNAME＞/.local/share/Xamarin/Mono for Android/debug.keystore
フィンガープリントを取得するには、keytoolというコマンドを使用する。具体的には、MacであればTerminalアプリで、以下のようなコマンドを実行する。Windowsの場合の手順は、Xamarin Developer Center（英語）の「Obtaining a Google Maps API Key（英語）」を参照してほしい。
|
keytool -list -v -keystore /Users/＜USERNAME＞/.local/share/Xamarin/Mono\ for\ Android/debug.keystore -alias androiddebugkey -storepass android -keypass android
|
Terminalで実行すると、図1のように結果が表示されるので、［SHA1:］で示されるフィンガープリントの値をメモしておく。
2-2. Google Developer ConsoleでAPIキーを取得する
次に、Google Developer ConsoleのWebサイトでGoogleMapAPIを有効にし、APIキーを取得する。
まず、ブラウザーでGoogle Developer Consoleを開き、［Create Project］ボタンを押し、任意の［PROJECT NAME］（ここでは「XamarinTips」としている）を入力して［Create］ボタンを押す。しばらくしてプロジェクトが作成されると画面がダッシュボードに移動する（図2）
［I have read and agree to all Terms of Service for the Google Cloud Platform products.］というチェックボックスがある場合、その内容に同意した上でこれにチェックを入れることで［Create］ボタンが有効になる。
次に、プロジェクトのダッシュボードが表示されるので、［Enable an API］ボタンを押す（図3）。
続いて、表示されるAPIのリストから［Google Maps Android API v2］の行を探し、［OFF］のボタンを押す（図4）。これによりAPIを有効化することを承認するためのポップアップが表示されるので、その［Accept］ボタンを押すことでONになる。
次に、左側のメニューから［APIs & auth］－［Credentials］を選択し、「Public API access」の［Create new Key］ボタンを押し、表示されるポップアップで［Android key］ボタンを押す。
次に表示されるポップアップに、先にメモしておいた「フィンガープリント」と「パッケージ名」をセミコロン（;）でつなげて入力し、最後に［Create］ボタンを押す。
すると先ほどの画面に［API KEY］が表示される。
この［API KEY］を次の手順で使用するのでメモしておく。
3. Google Play Servicesパッケージを導入する
ここから再びXamarin Studioに戻っての作業となる。
GoogleMapAPIは、Google Play Servicesの一部として提供されるので、別途、ライブラリを導入する。Xamarinで使用できるGoogle Play ServicesのライブラリをNuGetから導入する。
Xamarin Studioのメニューバーの［プロジェクト］－［Add Packages］を選択し、［Xamarin Google Play Services Binding］パッケージを追加する。
このパッケージは「Google Play Services」で検索すると見つかる。
【コラム】NuGetとComponents
Xamarin用のGoogle Play ServicesはComponentsでも提供されている。現在のところ両者に違いはないようだが、最近のXamarinのオンラインセミナーでは「Google Play ServicesはNuGetで提供される」と紹介されているので、ここではNuGetを使う方法を解説した。
4. AndroidManifest.xmlを記述する
再びAndroidManifest.xmlファイルを開き、以下のように修正する。
|
<?xml version="1.0" encoding="utf-8"?>
<manifest
xmlns:android="http://schemas.android.com/apk/res/android"
android:versionCode="1"
android:versionName="1.0"
package="GoogleMapSample.GoogleMapSample">
<uses-sdk />
<!-- 1権限の設定 -->
<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="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<!-- 2OpenGL ESの設定 -->
<uses-feature
android:glEsVersion="0x00020000"
android:required="true"/>
<application android:label="GoogleMapSample">
<!-- 3APIの設定 -->
<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="AIxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxUU" /> <!--4-->
</application>
</manifest>
|
1が、GoogleMapAPIで必要な権限の設定だ。ACCESS_COARSE_LOCATIONとACCESS_FINE_LOCATIONは、位置の測位を使用しないなら不要だが、地図アプリではほとんどの場合で使用するので設定しておいて方がよいだろう。
2はOpenGL ESを有効にするための設定だ。
3がGoogleMapAPIの設定情報であり、4がAPIキーだ。ここに先ほどメモした［API KEY］を設定する。
5. 画面を記述する
地図を表示する画面を作成する。
まずMain.axmlファイルを開き、以下のように修正する。
|
<?xml version="1.0" encoding="utf-8"?>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:name="com.google.android.gms.maps.MapFragment"/>
|
これは、GoogleMapAPIの地図表示部品であるMapFragmentを画面全体に表示するものだ。
また、MainActivity.csファイルは以下のように修正する。
|
[Activity(Label = "GoogleMapSample", MainLauncher = true, Icon = "@drawable/icon")]
public class MainActivity : Activity
{
protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);
SetContentView(Resource.Layout.Main);
}
}
|
これは、プロジェクト作成時に生成されたひな型コードを削除し、何も行わないようにしたものだ。
6. 実行する
ここまでのプログラムを実機で実行すると、次のように地図が表示される。
【コラム】エミュレーターでのGoogleマップの使用
Googleマップを使ったアプリは、通常使用しているAndroidエミュレーターでは実行できない。エミュレーターにGoogle Play Servicesが含まれていないためだ。
Google Play Servicesが含まれているエミュレーターを作成することもできるが、Android開発では知られている通り、とても動作が遅いので使う人は少ないだろう。GenymotionやIntel（x86）エミュレーターなどの高速なエミュレーターでGoogleマップを使う方法はあるもようだが、公式な手法ではないので、ここでは説明しない。各自で検索して情報を探してほしい。
まとめ
Xamarin.AndroidでGoogleマップを表示するまでの手順を解説した。見ての通り、ほとんどはXamarinでなくネイティブでの手順の解説であるが、GoogleMapAPIの使用は手順が非常に多く、何かを間違えると地図が表示されなかったり、アプリが落ちてしまったりするので、注意深く作業してほしい。
Xamarin公式のドキュメントは、Xamarin Developer Center（英語）の、
を参照されたい。
次回以降では、GoogleMapAPIの具体的な使用方法について、解説していく予定だ。
※以下では、本稿の前後を合わせて5回分（第18回～第22回）のみ表示しています。
連載の全タイトルを参照するには、［この記事の連載 INDEX］を参照してください。
18. Xamarin.iOSで地図に図形を表示するには？（MapKit使用）
Xamarin.iOSでiOS標準の地図ライブラリ「MapKit」を使って、ライン、ポリゴン、円などの図形を地図上に表示する方法を解説する。
19. Xamarin.iOSで地図にマーカーを表示するには？（MapKit使用）
Xamarin.iOSでiOS標準の地図ライブラリ「MapKit」を使って、マーカーを追加／削除するには？ また、マーカー選択時の処理や、吹き出し表示、吹き出しタップ時の処理の、基本的な実装方法を説明する。
20. 【現在、表示中】≫ Xamarin.Androidで地図を表示するには？（Google Maps使用）
Androidで最も一般的な地図API「Google Maps Android API v2」を使って、Xamarin.Androidで地図を表示する方法を解説。API利用環境の準備から、まずはGoogleマップを表示するまでの手順を説明する。
21. Xamarin.Androidで地図を操作するには？（Google Maps使用）
「Google Maps Android API v2」を使って、Xamarin.Androidアプリで地図の表示位置や種類を変更する方法、ジェスチャの有効／無効を切り替える方法などを説明する。
22. Xamarin.Androidで地図に図形を表示するには？（Google Maps使用）
「Google Maps Android API v2」を使って、Xamarin.Androidアプリで地図上にライン／ポリゴン／円などの図形を表示する方法を解説する。
