マップ画面のレイアウト作成
さて、残すはマップ画面のレイアウトです。マップを表示するにはGoogle Maps APIのキーを取得する必要がありますので、まずはキーを取得しましょう。
(1)証明書のフィンガープリントの取得
証明書のフィンガープリントはJDK付属のkeytool
コマンドを使用して取得します。コマンドプロンプトを開き、下記のようにコマンドを実行します。
>keytool -list -keystore "C:\Documents and Settings\ユーザ名\.android\debug.keystore"
パスワードの入力を求められるので、そのまま[Enterキー]を押下してスキップすると、証明書のフィンガープリントが出力されます。
証明書のフィンガープリント (MD5):***************
(2)Maps API Keyの取得
下記のサイトを開き、Googleアカウントでログインします。
- Maps API Key Signup:Google Code
画面下の方にある「ライセンスの同意」(下図の1)にチェックを入れ、「My cerrficate’s MD5 fingerpring」(下図の2)に先ほど取得した証明書のフィンガープリントを入力し、[Generate API Key]をクリックすると、生成されたAPIキーが表示されます。APIキーは後ほど使うのでメモしておきます。
以上で準備ができたので、他の画面と同様の手順で「map.xml」「MapActivity.java」のファイルを作成し、それぞれ下記のように記述します。map.xmlのandroid:apiKey="~"
には、取得したGoogle Maps APIキーを忘れずに記述してください。
<?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent"> <!-- 地図 --> <com.google.android.maps.MapView android:id="@+id/map" android:layout_width="fill_parent" android:layout_height="fill_parent" android:apiKey="取得したGoogle Map APIキーを記述" /> <!-- 地図の上に半透明のレイアウトを配置 --> <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#99000080" android:padding="2px" > <!-- 地図切り替えのラジオボタン --> <RadioGroup android:id="@+id/mapRadioGroup" android:orientation="horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content"> <!-- 通常の地図ボタン --> <RadioButton android:id="@+id/normalMapRadio" android:text="@string/map" android:textColor="#FFFFFFFF" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <!-- 衛星写真ボタン --> <RadioButton android:id="@+id/satelliteMapRadio" android:text="@string/map_satellite" android:textColor="#FFFFFFFF" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </RadioGroup> <!-- 現在地表示のトグルボタン --> <ToggleButton android:id="@+id/currentLocationToggle" android:layout_gravity="right|center_vertical" android:textOff="@string/current_location_off" android:textOn="@string/current_location_on" android:layout_width="fill_parent" android:layout_height="wrap_content" /> </LinearLayout> </FrameLayout>
package sample.bizcard; import android.os.Bundle; /** * 地図表示アクティビティ * MapViewを扱うアクティビティはcom.google.android.maps.MapActivityを継承する必要がある */ public class MapActivity extends com.google.android.maps.MapActivity { @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // 自動生成されたR.javaの定数を指定してXMLからレイアウトを生成 setContentView(R.layout.map); } @Override protected boolean isRouteDisplayed() { return false; } }
「AndroideManifest.xml」にも、同様にアクティビティの定義を追加します。また、マップを利用するためには、画像をインターネットから取得する必要があるので、インターネットへの接続権限(android.permission.INTERNET
)の追加が必要になります(下記太字部分)。さらに、MapViewやMapActivityは、Androidではなく別ライブラリとしてGoogleから提供されているため、ライブラリ(com.google.android.maps
)の利用宣言も追加します。
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="sample.bizcard" android:versionCode="1" android:versionName="1.0"> <!-- インターネットへのアクセス権限 --> <uses-permission android:name="android.permission.INTERNET" /> <application android:icon="@drawable/icon" android:label="@string/app_name"> <!-- GoogleMapのライブラリの利用を宣言 --> <uses-library android:name="com.google.android.maps" /> : :中略 : </manifest>
なお、インターネットへの接続以外にも、さまざまな権限が存在します。下記を参照ください。
- Manifest.permission:Android Developers
まとめ
駆け足で一通りの画面のレイアウトを作成しましたが、レイアウト作成のコツはつかめたでしょうか? Androidのアプリケーション開発を始めた頃、私が最も苦労・苦戦したのは思いどおりにレイアウトが作れない事でした。しかし、ここさえ超えれば後は住み慣れたJavaの世界なので心配はいりません。
次回はデータベースの利用について説明します。