😽

[チュートリアル2]compose multiplatformでアプリを作るとき最初にやること[Compose multiplatform]

2023/11/07に公開

はじめに

公式チュートリアルの和訳と要約+αです。
前回は環境構築

手順

Android Studioで開くまで

  1. kotlin multiplatform wizardに行く
  2. project nameに自分の作りたいアプリの名前を入力
  3. androidとdesktopのオプションを選択
  4. macならiOSのオプションも選択
  5. downloadボタンを押す
  6. ファインダーでダウンロードしたzipファイルを見つけて解凍
  7. 開発フォルダに移動
  8. Android Studioを開く
  9. Openボタンから先ほどダウンロードしたフォルダを選択する
  10. Android Studioの左上のAndroidって書いてあるボタンをクリックして、Projectを選び、全体のフォルダ構成が見えるようにする
    changeview

フォルダ構造の簡単な解説

プロジェクトには「composeApp」と「iosApp」の2つのモジュールがあります。
「composeApp」は、Android、デスクトップ、iOS向けの共通ロジックを持つKotlinモジュールです。
「iosApp」はiOSアプリケーションとしてビルドされるXcodeプロジェクトで、共有モジュールを依存関係として使用します。
「composeApp」モジュールには、4つのソースセットが含まれており、それぞれ異なるプラットフォーム向けのコードを持っています。
共通のKotlinコードは、AndroidライブラリとしてビルドするとKotlin/JVMとして、iOSフレームワークとしてビルドするとKotlin/Nativeとして扱われます。
できるだけ特定のプラットフォームに固有のコードを複製するのではなく、共通のコードを使用して実装することが推奨されています。

アプリを立ち上げるまで

Androidアプリ

  1. Android StudioのDeviceManagerから適当なエミュレーターを立ち上げるor実機をつなぐ
  2. run configurationでcomposeAppを選ぶ
  3. Runをクリックする

iOSアプリ

  1. Android Studioのrun configuration(右上の方のプルダウン)でiosAppを選択します
  2. その右のrunボタン(緑の三角)を押します。

desktopアプリ

このエラーによって公式ドキュメント通りにやったらうまくいきません。

gradleからrunしていきましょう

  1. Android Studioの右上にある歯車マークをクリック
  2. でてきたプルダウンの中からrun anythingを選択
  3. 実行するタスク名を入力する窓が出てくるので以下を入力してEnter

gradle :composeApp:run

一度やればあとは上のrun configurationから選べば良くなります。

次はこれ

参考にしたもの

https://www.jetbrains.com/help/kotlin-multiplatform-dev/compose-multiplatform-create-first-app.html

Discussion