APIキーの取得
MapViewを利用するには予めAndroid用GoogleMapのAPIキーを取得しておく必要がある。
Google Cloud PlatformでAPIキーの取得を行っておく。
プロジェクトを作成後、APIとサービスを有効化からMaps SDK for Androidを選択すれば良い。
プロジェクトの作成 プルダウンを押下すると新規作成の項目がある。
APIとサービスの有効化 右側の+アイコンより選択画面に進める。
認証情報の欄からアクセス用のAPIキーを作成、確認できる。
app/build.gradle
google play serviceを使用する
implementation 'com.google.android.gms:play-services-maps:17.0.0'
Manifest
Manifestに取得したAPIキーを記述する。通常は専用のresourceファイルなどで記述し、.ignore指定すればよい。
<meta-data
androidname="com.google.android.geo.API_KEY"
androidvalue="ここに取得したAPIキーを記載"/>
layout
MapViewオブジェクトをそのまま使用せず、SupportMapFragmentを配置するようにする。
xml version="1.0" encoding="utf-8"
<fragment xmlnsandroid="http://schemas.android.com/apk/res/android"
xmlnstools="http://schemas.android.com/tools"
xmlnsmap="http://schemas.android.com/apk/res-auto"
androidlayout_width="match_parent"
androidlayout_height="match_parent"
androidid="@+id/map"
toolscontext=".MapsActivity"
androidname="com.google.android.gms.maps.SupportMapFragment"/>
Activity
配置したSupportMapFragmentにOnMapReadyCallbackの実装を渡せばよい。
class MapsActivity : AppCompatActivity(), OnMapReadyCallback {
private lateinit var mMap: GoogleMap
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_maps)
val mapFragment = supportFragmentManager
.findFragmentById(R.id.map) as SupportMapFragment
mapFragment.getMapAsync(this)
}
override fun onMapReady(googleMap: GoogleMap) {
mMap = googleMap
}
}
カメラの移動
地図の初期位置や表示位置の変更等に使用する。
fun cameraPosition(mMap:GoogleMap){
var defaultPosition = LatLng(35.70316439, 139.57984714)
val camera = CameraUpdateFactory.newLatLngZoom(defaultPosition, 15f)
mMap.moveCamera(camera)
}
ピンマーカーの設置
fun setMarker(mMap:GoogleMap){
val options = MarkerOptions()
options.position( LatLng(35.70436915, 139.57947137) )
mMap.addMarker(options);
options.position( LatLng(35.70138951, 139.5772505) )
mMap.addMarker(options);
}
ピンマーカーのクリックイベントリスナー
選択されたmarker.idは"m"addMarkerされた順序
のidentifierとなっている。
returnするbooleanはクリック時にカメラを移動するか否か。「しない」がtrueなので注意。
mMap.setOnMarkerClickListener { marker ->
val id = marker.id.replace("m", "").toInt()
Toast.makeText(this, id.toString(), Toast.LENGTH_SHORT).show()
false
}
ピンマーカーにセットしたタイトルのクリックイベントリスナー
setOnInfoWindowClickListenerを定義する
mMap.setOnInfoWindowClickListener { marker ->
val id = marker.id.replace("m", "").toInt()
Toast.makeText(this, id.toString(), Toast.LENGTH_SHORT).show()
}
サンプルコード
github.com
MapViewのサンプルアプリはこの本でも触れられている
リンク
リンク
リンク