SwiftUIでAzure Maps iOS SDKを導入する

2021.10.16

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

いわさです。

パブリックプレビューですが、Azure MapsのiOS SDKがリリースされました。

手順としてはパッケージをインストールし、ビューを設定するだけなのですが、公式ドキュメントで案内されているものはStoryboardでの手順です。
私は今回SwiftUIでセットアップしまして、せっかくなので初期導入部分のSwiftUI版手順を共有を兼ねて残しておきます。

SwiftUIが初だと詰まる人いるかもしれません。

Azure Mapsアカウントを作成し共有キーを取得する

ここの手順は通常と同じです。
Azure Mapsアカウントを作成し、共有キーを取得します。

価格レベルの選択については以下を参照してください。
私はGen2で試しました。

共有キー以外にAzureADでの認証も出来るようです。
たしかに、SDK上も初期化処理にAADクライアント、アプリID、テナントIDを使って初期化する構成メソッドも用意されていました。

本日は共有キーを使用しました。

パッケージのインストールと初期化

Xcodeでプロジェクトの初期化をした後、パッケージを追加します。

検索ウインドウにhttps://github.com/Azure/azure-maps-ios-sdk-distribution.gitを入力して直接参照します。

一点注意点があって、Dependency Ruleのバージョンはデフォルトの1.0.0ではなく1.0.0-pre.1に変更してください。
1.0.0のままだと以下のエラーが発生します。

Dependencies could not be resolved because no versions of 'azure-maps-ios-sdk-distribution' match the requirement 1.0.0..<2.0.0 and root depends on 'azure-maps-ios-sdk-distribution' 1.0.0..<2.0.0.

パッケージを追加したら、先程取得した共有キーを使って初期化処理を行います。
Storyboardの手順では、AppDelegate.swiftで初期化するよう案内があります。

SwiftUIの場合はUIApplicationDelegateAdaptorを使って同様の処理を行うことが出来ます。
以下を参考にさせて頂きました。

以下のハイライト部分が追記した部分となります。
configureメソッドの引数は共有キーです。

iwasa_azure_mapsApp.swift

import SwiftUI
import AzureMapsControl

@main
struct iwasa_azure_mapsApp: App {
    @UIApplicationDelegateAdaptor(AppDelegate.self) var appDelegate
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

class AppDelegate: UIResponder, UIApplicationDelegate {
    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey : Any]? = nil) -> Bool {
        AzureMaps.configure(subscriptionKey:"hogehogehogehogehogehogehogehogehogehoge")
        return true
    }
}

ビューの追加

次に、MacControlビューを追加します。
Storyboardの場合は、ViewControlにUIViewを追加してクラスとモジュールを指定するだけで良いです。

SwiftUIでUIViewを使う場合は、UIViewRepresentableプロトコルを実装したクラスを作成し、MapControlをラップしてやることでSwitfUIで利用することが出来ます。

こちらは以下を参考にさせて頂きました。

ハイライト部分が追記した部分となります。

ContentView.swift

import SwiftUI
import AzureMapsControl

struct ContentView: View {
    var body: some View {
        AzureMap()
    }
}

struct AzureMap: UIViewRepresentable {

    func makeUIView(context: Context) -> MapControl {
        return MapControl()
    }

    func updateUIView(_ uiView: MapControl, context: Context) {
    }
}

実行

ここまでで公式ドキュメントのStoryboardと同内容のSwiftUI版手順となります。
実行してみます。

確認することが出来ました。

まとめ

  • StoryboardとSwiftUIで結構手順は変わる
  • SwiftUIでもAzure Maps iOS SDKは動作可能

導入出来たので色々カスタマイズして遊ぶ予定です。