今回は iOS 開発しかやったことがない僕が、iOS 開発者による iOS 開発者のための KMM 入門 として環境構築からサンプルアプリのビルドまでをやっていきます。
また、 KMM とはなんぞや？という話は僕も入門したてなので、省略します。。
KMM の環境構築は以下の公式ドキュメントが非常に参考になります。
このチュートリアルもこの記事を基本的に参考にしています。
Set up an environment for KMM development—Kotlin Multiplatform Mobile Docs
今回やるのは
- Andorid Studio のインストール
- KMM プラグインのインストール
- プロジェクトの作成
- エミュレータの用意
- Android Studio を再起動して Android / iOS 両 OS でビルド
まで行います。
Android Studio のインストール
Android Studio は Homebrew 等でもインストールできますが、公式だと現在 4.1.2 になります。
KMM には 4.2 以上が必要なので、ベータ版またはアルファ版をインストールしていきます。
ベータ版またはアルファ版は Preview と呼ばれるのですが、以下のサイトより公式でダウンロードできます。
Preview には
- Beta build
- Canary build
があるのですが、 Beta はベータ版で、 Canary はアルファ版だと思ってください。
KMM にはどちらでも大丈夫です！
Android Studio Preview, Android Developers
ダウンロードしたら解凍して Mac の Applications ディレクトリに配置して開きます。
インストール時はガイドに沿ってやれば大丈夫です。
KMM プラグインを Android Studio にインストールする
Android Studio > Preferences (または ⌘ + ,) で設定を開きます。
検索窓に plugins と入力して Plugins を開きます。
次に画面右の Marketplace タブを選択し、 KMM と入力します。
すると “Kotlin Multiplatform Mobile” が出てくるので install ボタンを押してインストールしてください。
これで KMM プラグインのインストールは完了です。
KMM プロジェクトの作成
これで環境はほとんど構築完了しました。
残りいくつかを実施するためにプロジェクトを作ります。
Android Studio の File > New > New Project を開きます。
出てきたダイアログの左タブが “Phone and Tablet” になっていることを確認して、右側を最下までスクロールします。
すると、 “KMM Application” というのが最後にあると思うので、そちらをクリックします。
次に出たダイアログで、以下のように設定します。
Next ボタンを押して次画面は最後の “Add sample tests for Shared Module” にチェックを入れてほかはそのままで大丈夫です。
ちなみにここの Android Application Name と iOS Application Name は iOS でいう targetName 的なやつです。
アプリ名ではないので、わかり易い名前をつければ大丈夫です。
ここまで終わったら Finish を押してプロジェクト作成は完了です。
Android エミュレータをインストールする
ここから少し公式と変わってきます。
初めて Android Studio をインストールしたかたはまだ Android のエミュレータ (iOS でいう Simulator) が入ってないです。
まずはこちらをインストールしましょう。
画面右上にあるアイコンから AVD Manager を押します。
出てきたダイアログの下にある Create Virtual Device… を押します。
適当に Pixel 3 とか好きな端末を選んで、 Next を押します。
次画面で Android OS を選ぶのですが、Recommended のタブから選んでください。
理由としては、 Other Images だと arm64 向けの OS を選んでしまうと、 CPU アーキテクチャが最適化されておらず、エミュレータの動作が激重になったりと不具合があるからです。
OS を選んだら Next を押して次画面へ行きます。
次画面は特にいじらず Finish で OK です。
暫く待つと SDK がインストールされて完了です。
Android Studio の再起動
ここまで来たらあと一歩です。
Configuration を自動で追加させるために、一度再起動します。
Android Studio の File > Invalidate Cache / Restart… を選択します。
これによってキャッシュがクリアされ、 Andorid Studio が再起動するはずです。
再起動したら、画面右下にローディングが表示されて、色々依存関係を解決してくれたりします。
ちょっと待ちましょう。
ローディングが終わったら画面右上あたりに androidApp っていう Configuration が追加されているか、その左の▶ビルドボタンが緑色に活性化しているか確認してみてください。
ビルドしてみる
先程確認した Configuration が androidApp となっていることを確認して、ビルドボタンを押してください。
Android エミュレータが立ち上がって、以下のような画面が出れば成功です。
次に Configuration を iosApp に変更してビルドします。
成功したら以下のような画面が表示されます。
iOS のビルドはよく失敗するという話があります。
その時は今回作ったディレクトリの中にある iosApp.xcodeproj をいつもどおり Xcode で開いて、 Xcode でビルドしてみてください。
おわり
これで KMM の環境構築は完了しました。
公式ドキュメントには再起動する話とか載って無くて結構ハマりました。。
iOS 開発者からするとハマリポイントは多々あると思うので、ハマったらこの記事にコメントしてください。
KMM の知見はこちらのブログに引き続き書いていきますので、どうぞよろしくおねがいします！