ArcGIS Developers 開発リソース集 > スタートアップガイド > アプリ開発 > Android

Android

出典：ArcGIS Maps SDK for Kotlin - Tutorials - Display a map

マップを表示する

このチュートリアルでは ArcGIS Maps SDK for Kotlin を使用して、マップとベースマップレイヤーを表示する方法を紹介します。

マップには、地理データのレイヤーが含まれています。マップには、ベースマップレイヤーと、オプションで 1 つ以上のデータレイヤーを追加できます。マップビューを使用し、場所とズームレベルを設定することで、マップの特定の領域を表示できます。

このチュートリアルでは、地形ベースマップレイヤーを使用して、富士山付近を表示する地図を作成します。

前提条件

このチュートリアルを実施するには、以下が必要です。

API キーにアクセスするための ArcGIS 開発者アカウント。アカウントをお持ちでない場合は、サインアップ (無料) してください。アカウントの作成方法は「開発者アカウントの作成」をご覧ください。
開発環境がシステム要件を満たしていることを確認します。
Kotlin で Android 開発をするための IDE。このチュートリアルでは Android Studio を使用していますが、記述されたコードは Kotlin をサポートする任意の Android の IDE で動作します。

注: このチュートリアルの完成版のコードは、Android Studio Chipmunk 2021.2.1 Patch 2 で作成されています。ただし、以下の手順で説明するコードは、Android Studio のその後のバージョンを含む、Kotlin をサポートする任意の Android IDE で動作するはずです。Android Studio Flamingo 2022.2.1 以降を使用する場合は、Android Studio プロジェクトの作成時に「Empty Views Activity」テンプレートを使用してください。

ステップ

新しい Android Studio プロジェクトを作成します。

Android Studio を使用してアプリを作成し、API を参照するように構成します。

Android Studio を開きます。
- メニューバーで [File] → [New] → [New Project….] をクリックします。
- [Create New Project] ウィンドウで、[Phone and Tablet] タブが選択されていることを確認してから、[Empty Activity] を選択して、[Next] をクリックします。
- [Configure your project] ウィンドウで、以下の項目を設定します。
  - Name: Display a map
  - Package name： com.example.app に変更します。または、組織に合わせて変更してください。
  - Save location: 新しいフォルダに設定します。
  - Language: Kotlin
  - Minimum SDK: API 26:Android 8.0 (O)
プロジェクトのツールウィンドウで、現在のビューが Android であることを確認してください。チュートリアルの説明では、そのビューを参照しています。

ビュー名が Android 以外の名前（プロジェクトやパッケージなど）の場合、プロジェクトツールウィンドウのタイトルバーの左端のコントロールをクリックし、リストから Android を選択します。

プロジェクトツールウィンドウから、[Gradle Scripts] > [build.gradle (Project: Display_a_map)] を開きます。ファイルの内容を次のコードに置き換えます。

build.gradle (Project: Display_a_map)

// すべてのサブプロジェクト/モジュールに共通の構成オプションを追加できる最上位のビルド ファイル
plugins {
    id 'com.android.application' version '7.3.1' apply false
    id 'com.android.library' version '7.3.1' apply false
    id 'org.jetbrains.kotlin.android' version '1.7.20' apply false
}


task clean(type: Delete) {
    delete rootProject.buildDir
}

プロジェクトツールウィンドウから、[Gradle Scripts] > [build.gradle (Module: app)] を開きます。ファイルの内容を次のコードに置き換えます。

build.gradle (Module: Display_a_map)

plugins {
    id 'com.android.application'
    id 'org.jetbrains.kotlin.android'
}

android {
    compileSdk 33

    defaultConfig {
        applicationId "com.example.app"
        minSdk 26
        targetSdk 33
        versionCode 1
        versionName "1.0"

        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_11
        targetCompatibility JavaVersion.VERSION_11
    }

    buildFeatures {
        dataBinding true
    }

    namespace 'com.example.app'

}

dependencies {
    implementation 'androidx.appcompat:appcompat:1.5.1'
    implementation 'com.google.android.material:material:1.7.0'
    implementation 'androidx.constraintlayout:constraintlayout:2.1.4'
    implementation "com.esri:arcgis-maps-kotlin:200.2.0"
}

プロジェクトツールウィンドウから、[Gradle Scripts] > [settings.gradle] を開きます。ファイルの内容を次のコードに置き換えます。

settings.gradle (Display a map)

pluginManagement {
    repositories {
        gradlePluginPortal()
        google()
        mavenCentral()
    }
}

dependencyResolutionManagement {
    repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
    repositories {
        google()
        mavenCentral()
        maven {
            url 'https://esri.jfrog.io/artifactory/arcgis'
        }
    }
}

rootProject.name = "Display a map"
include ':app'

Gradle の変更を同期します。[Sync now] プロンプトをクリックするか、ツールバーの更新アイコン(Sync Project with Gradle Files)をクリックします。同期に数分かかるかもしれません。
プロジェクトツールウィンドウから、[app] > [manifests] > [AndroidManifest.xml] を開きます。Android マニフェストを更新して、インターネット接続を許可します。

これらの新しい要素を manifest 要素内に挿入します。他のステートメントを変更または削除しないでください。

今後追加する ArcGIS の機能によっては、マニフェストに追加のアクセス許可を追加する必要がある可能性があります。

AndroidManifest.xml
```
<manifest xmlns:android="http://schemas.android.com/apk/res/android">

// 追加開始
<uses-permission android:name="android.permission.INTERNET"/>
// 追加終了
```

インポートステートメントを追加する

[app] > [java] > [com.example.app MainActivity.kt] を開き、API を参照するためのインポートステートメントを追加します。

MainActivity.kt

package com.example.app

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle

// 追加開始
import android.util.Log
import android.widget.Toast
import androidx.databinding.DataBindingUtil
import com.arcgismaps.ApiKey
import com.arcgismaps.ArcGISEnvironment
import com.arcgismaps.mapping.ArcGISMap
import com.arcgismaps.mapping.BasemapStyle
import com.arcgismaps.mapping.Viewpoint
import com.arcgismaps.mapping.view.MapView
import com.example.app.databinding.ActivityMainBinding
// 追加終了

class MainActivity : AppCompatActivity() {

マップビューの UI を追加する

マップビューは、マップを表示する UI コンポーネントです。また、タッチジェスチャによるナビゲートなど、ユーザーによるマップの操作も処理します。XML を使用してマップビューを UI に追加し、メインアクティビティのソースコードで使用できるようにします。

[app] > [res] > [layout] > [activity_main.xml] で、TextView 要素全体を MapView 要素に置き換えます。

XML コードが表示されない場合は、[Code] タブを選択してデザインモードを切り替え、エディターに XML コードを表示します。

MapView 要素は、ArcGIS Maps SDK for Kotlin から MapView クラスのインスタンスを作成します。

メインアクティビティソースコードでは、android:id 属性の値で宣言されている暗黙的なプロパティを使用してその MapView インスタンスにアクセスできます。この場合、プロパティの名前は mapView になります。

activity_main.xml を下記のように置き換えます。

activity_main.xml
```
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">

    <androidx.constraintlayout.widget.ConstraintLayout xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

        <com.arcgismaps.mapping.view.MapView
            android:id="@+id/mapView"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>
```
MainActivity.kt で、activityMainBinding という名前の遅延プロパティを作成します。 Android クラスの DataBindingUtil を使用して、メインアクティビティのコンテンツビューを特定のレイアウトに設定します。

MainActivity.kt
```
class MainActivity : AppCompatActivity() {

    // 追加開始
    private val activityMainBinding: ActivityMainBinding by lazy {
        DataBindingUtil.setContentView(this, R.layout.activity_main)
    }        
    // 追加終了
```

mapView という読み取り専用の変数を作成し、それを activity_main.xml で作成された mapView にバインドします。

MainActivity.kt

class MainActivity : AppCompatActivity() {
       
    private val activityMainBinding: ActivityMainBinding by lazy {
        DataBindingUtil.setContentView(this, R.layout.activity_main)
    }

    // 追加開始
    private val mapView: MapView by lazy {
        activityMainBinding.mapView
    }
    // 追加終了

マップを追加する

マップビューを使用して、富士山を中心としたマップを表示します。マップには、地形ベースマップレイヤーが含まれます。

MainActivity.kt で、MainActivity クラスに新しい setupMap() メソッドを追加し、ArcGISMap を作成します。

BasemapStyle.ArcGISTopographic というベースマップスタイルを使用して ArcGISMap を構成します。

MainActivity.kt

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

    }

    // 追加開始
    private fun setupMap() {

        val map = ArcGISMap(BasemapStyle.ArcGISTopographic)

    }
    // 追加終了

}

mapView の map プロパティを ArcGISMap に設定します。次に、ViewPoint を作成し、それを mapView に追加します。

MainActivity.kt

    private fun setupMap() {

        val map = ArcGISMap(BasemapStyle.ArcGISTopographic)

        // 追加開始
        // レイアウトの MapView に表示されるマップを設定
        mapView.map = map

        mapView.setViewpoint(Viewpoint(35.360626, 138.727363, 200000.0))
        // 追加終了

    }

}

onCreate() メソッドで、setContentView(R.layout.activity_main) コードを探し、見つかった場合は削除します。

Android Studio の New Project ウィザードを使用した場合、onCreate() ライフサイクル関数で setContentView(R.layout.activity_main) が記述されている可能性があります。そのコードを削除する必要があります。その代わりに、前の手順で宣言した遅延プロパティ activityMainBinding を使用します。

onCreate() メソッドで、lifecycle.addObserver() を呼び出し、マップビューを渡します。次に、前の手順で定義した関数 setupMap() を呼び出します。

MainActivity.kt

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
       
    // 追加開始
    lifecycle.addObserver(mapView)
    setupMap()
    // 追加終了

}

API キーを設定する

API キーは、ArcGIS Online でホストされているサービス、Web マップ、および Web シーンへのアクセスを可能にします。

開発者用ダッシュボードで、API キーを取得します。このチュートリアルでは、デフォルトの API キーを使用します。作成方法は「API キーの取得」をご覧ください。

setApiKey() メソッドを作成し、ArcGISEnvironment.apiKey プロパティを設定します。ApiKey.create() を呼び出し、API キーを文字列として渡します。またダブルクォーテーションを付けるのを忘れないでください。

MainActivity.kt

    private fun setupMap() {

        val map = ArcGISMap(BasemapStyle.ArcGISTopographic)

        // レイアウトの MapView に表示するマップを設定
        mapView.map = map

        mapView.setViewpoint(Viewpoint(35.360626, 138.727363, 200000.0))

    }

    //  追加開始
    private fun setApiKey() {

        // API キーをソースコードに保存することはベストプラクティスではありません。
        // このチュートリアルでは便宜上ソースコードに記載しています。
        ArcGISEnvironment.apiKey = ApiKey.create("API キーを入力")

    }
    //  追加終了

}

onCreate() ライフサイクルメソッド内で、setupMap() を呼び出す前に setApiKey() を呼び出します。

MainActivity.kt

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)

    lifecycle.addObserver(mapView)

    // 追加開始
    setApiKey()
    // 追加終了

    setupMap()


}

アプリを実行する

[Run] > [Run] > [app] をクリックして、アプリを実行します。

Android Studio では、アプリを実行するのに、実際の Android 端末と Android エミュレータの 2 通りの方法があります。

Android デバイス

パソコンと Android 端末を、USB または Wi-Fi で接続します。詳しくは、「Android デバイスを接続する方法」をご覧ください。

Android エミュレータ

Android エミュレータで動作させるための AVD(Android Virtual Device)を作成します。詳しくは、「Android Emulator 上でアプリを実行する」をご覧ください。

デバイスの選択

Android Studio でアプリをビルドして実行する場合、まずデバイスを選択する必要があります。Android Studio のツールバーから、現在利用可能なデバイス（仮想および物理の両方）のドロップダウンリストにアクセスできます。

ツールバーのリストにアクセスできない場合は、[Tools] → [Device Manader] をクリックします。

富士山を中心に、地形ベースマップレイヤーが追加されたマップが表示されます。マップビュー上でマウスホイールをダブルクリック、ドラッグ、およびスクロールして、マップを操作します。

完成版のプロジェクトはこちらからダウンロードできます (マップの表示場所は本チュートリアルで設定した場所とは異なります)。

Web マップを表示する

「Web マップの作成」のガイドで Web マップを作成している場合は、作成した Web マップも基本的に同じステップで表示できます。

マップを表示するのステップで作成したプロジェクトの [app] > [java] > [com.example.app] > [MainActivity.kt] を開き、必要なインポートステートメントを追加します。

MainActivity.kt
```
import com.arcgismaps.portal.Portal
import com.arcgismaps.mapping.PortalItem
```

setupMap メソッドを下記のように書き換えます。

MainActivity.kt

val portal = Portal("https://www.arcgis.com", Portal.Connection.Anonymous)

val itemId = "Web マップの ID"
val portalItem = PortalItem(portal, itemId)
val map = ArcGISMap(portalItem)
   
mapView.map = map

アプリの動作が確認できたら ArcGIS のセキュリティと認証について学びましょう！

Android

マップを表示する

前提条件

ステップ

新しい Android Studio プロジェクトを作成します。

インポートステートメントを追加する

マップビューの UI を追加する

マップを追加する

API キーを設定する

アプリを実行する

Android デバイス

Android エミュレータ

デバイスの選択

Web マップを表示する