Repository files navigation

NoteThe iOS part of Compose Multiplatform is in Alpha. It may change incompatibly and require manual migration in thefuture.If you have any issues, please report them onGitHub.

PSThis template is a fork fromJetbrains' compose multiplatform template

WarningYou need a Mac with macOS to write and run iOS-specific code on simulated or real devices.This is an Apple requirement.

To work with this project, you need the following:

• A machine running a recent version of macOS
• JDK 17
• Xcode
• Android Studio
• TheKotlin Multiplatform Mobile plugin
• TheCocoaPods dependency manager

Before you start, use theKDoctor tool to ensure that your development environmentis configured correctly:

1. Install KDoctor withHomebrew:

   brew install kdoctor

2. Run KDoctor in your terminal:

   kdoctor

   If everything is set up correctly, you'll see valid output:

   Environment diagnose (to see all details, use -v option):[✓] Operation System[✓] Java[✓] Android Studio[✓] Xcode[✓] CocoapodsConclusion:  ✓ Your system is ready for Kotlin Multiplatform Mobile development!

Otherwise, KDoctor will highlight which parts of your setup still need to be configured and will suggest a way to fixthem.

Open the project in Android Studio and switch the view fromAndroid toProject to see all the files and targetsbelonging to the project:

Your Compose Multiplatform project includes 4 modules:

This is a Kotlin module that contains the logic common for desktop, Android, and iOS applications, that is, the code youshare between platforms.

Thisshared module is also where you'll write your Compose Multiplatform code.Inshared/src/commonMain/kotlin/App.kt, you can find the shared root@Composable function for your app.

It uses Gradle as the build system. You can add dependencies and change settings inshared/build.gradle.kts.Theshared module builds into a Java library, an Android library, and an iOS framework.

This is a Kotlin module that builds into a desktop application. It uses Gradle as the build system. ThedesktopAppmodule depends on and uses theshared module as a regular library.

This is a Kotlin module that builds into an Android application. It uses Gradle as the build system.TheandroidApp module depends on and uses theshared module as a regular Android library.

This is an Xcode project that builds into an iOS application.It depends on and uses theshared module as a CocoaPods dependency.

To run your desktop application in Android Studio, selectdesktopApp in the list of run configurations and clickRun:

You can also run Gradle tasks in the terminal:

• ./gradlew run to run application
• ./gradlew package to store native distribution intobuild/compose/binaries

To run your application on an Android emulator:

1. Ensure you have an Android virtual device available.Otherwise,create one.

2. In the list of run configurations, selectandroidApp.

3. Choose your virtual device and clickRun:

   
   

To run your application on an iOS simulator in Android Studio, modify theiosApp run configuration:

1. In the list of run configurations, selectEdit Configurations:

   

2. Navigate toiOS Application |iosApp.

3. In theExecution target list, select your target device. ClickOK:

   

4. TheiosApp run configuration is now available. ClickRun next to your virtual device:

You can run your Compose Multiplatform application on a real iOS device for free.To do so, you'll need the following:

• TheTEAM_ID associated with yourApple ID
• The iOS device registered in Xcode

NoteBefore you continue, we suggest creating a simple "Hello, world!" project in Xcode to ensure you can successfully runapps on your device.You can follow the instructions below or watchthisStanford CS193P lecture recording.

In the terminal, runkdoctor --team-ids to find your Team ID.KDoctor will list all Team IDs currently configured on your system, for example:

3ABC246XYZ (Max Sample)ZABCW6SXYZ (SampleTech Inc.)

To run the application, set theTEAM_ID:

1. In the template, navigate to theiosApp/Configuration/Config.xcconfig file.
2. Set yourTEAM_ID.
3. Re-open the project in Android Studio. It should show the registered iOS device in theiosApp run configuration.

To get a better understanding of this project's setup and learn how to configure the basic properties of your iOS app without Xcode,open theiosApp/Configuration/Config.xcconfig file in Android Studio. The configuration file contains:

• APP_NAME, a target executable and an application bundle name.
• BUNDLE_ID,whichuniquely identifies the app throughout the system.
• TEAM_ID,a unique identifier generated by Apple that's assigned to your team.

To configure theAPP_NAME option, openConfig.xcconfig in any text editorbefore opening the project in AndroidStudio, and then set the desired name.

If you need to change this option after you open the project in Android Studio, do the following:

1. Close the project in Android Studio.
2. Run./cleanup.sh in your terminal.
3. Change the setting.
4. Open the project in Android Studio again.

To configure advanced settings, use Xcode. After opening the project in Android Studio,open theiosApp/iosApp.xcworkspace file in Xcode and make changes there.

Now you are ready to fly✈️, this project was configured, built and made with ❤️ byAhmed Nassar, for any questions, enhancements, new feature enquiries or bug fixes please head toIssues Section and don't hesitate to share with me your thoughts 👀.

Happy coding 💻.