Repository files navigation

Build Compose UIs faster and let your creativity flow when designing multiplatform user interfaces.

With Compose Hot Reload, you can make UI code changes in a Compose Multiplatform app and see the results instantly,without needing to restart.The JetBrains Runtime intelligently reloads your code whenever it changes.

• Kotlin 2.1.20 or higher.
• Compose compiler 2.1.20 or higher.
• Compose Multiplatform 1.8.2
• JetBrains Runtime.To be compatible with JetBrains Runtime, your project needstotargetJava 21 or earlier.

There are two ways to add Compose Hot Reload to your project:

• Create a project from scratch in IntelliJ IDEA or Android Studio
• Add it as a Gradle plugin to an existing project

Follow theKotlin Multiplatform quickstartguide to set up your environment and create a project. Be sure to select the desktop target when you create the project.

1. In your project, update the version catalog. Ingradle/libs.versions.toml, add the following code:

   composeHotReload = { id = "org.jetbrains.compose.hot-reload", version.ref = "composeHotReload"}

2. In thebuild.gradle.kts of your parent project, add the following code to yourplugins {} block:

   plugins {    alias(libs.plugins.composeHotReload) apply false}

   This prevents the Compose Hot Reload plugin from being loaded multiple times in each of your subprojects.

3. In thebuild.gradle.kts of the subproject containing your multiplatform application, add the following code to yourplugins {} block:

   plugins {     alias(libs.plugins.composeHotReload)}

4. An installation of the JetBrains Runtime is required:Launching Compose Hot Reload with the Kotlin Multiplatform IDE plugin will re-use IntelliJ's installation of theJetBrains Runtime.If you want Gradle to automatically download the JetBrains Runtime, add the following code to yoursettings.gradle.kts file

   plugins {    id("org.gradle.toolchains.foojay-resolver-convention") version "1.0.0"}

5. Click theSync Gradle Changes button to synchronize Gradle files:

   

You can run your application with Compose Hot Reload from inside your IDE or from the CLI by using Gradle tasks.

In IntelliJ IDEA or Android Studio, in the gutter, click theRunicon of your main function:

• If you have theKotlin Multiplatform IDE plugininstalled, selectRun 'MainKt [hotRunJvm]' with Compose Hot Reload (Rc).
• Otherwise, manually create Gradle run configurations with hot reload tasks (seeRun tasks).

The Compose Hot Reload plugin automatically creates the following tasks to launch the application in 'hot reload mode':

• :hotRunJvm: For multiplatform projects. The async alternative is:hotRunJvmAsync.
• :hotRun: For Kotlin/JVM projects. The async alternative:hotRunAsync.

You can run these Gradle tasks from the command line:

./gradlew :app:hotRunJvm

After making changes, save all files to automatically update your app's UI.

If you define a custom JVM target name, Gradle uses a different task name. For example, if your target name isdesktop:

kotlin {    jvm("desktop")}

The task name is:hotRunDesktop.

Here's a list of all the possible arguments that you can use with the Gradle run tasks:

You can configure the main class directly in your build script instead of passing it as a command-line argument.

You can configure it in the Compose Hot Reload task:

tasks.withType<ComposeHotRun>().configureEach {    mainClass.set("com.example.MainKt")}

Or if you use Compose Multiplatform, in theapplication {} block:

compose.desktop {    application {        mainClass="com.example.MainKt"    }}

The Compose Hot Reload plugin also provides Gradle tasks to recompileand reload your application:

• reload: Reload all, currently running, applications.
• hotReloadJvmMain: Reload all applications that use thejvmMain source set.

For example:

./gradlew :app:reload

If you want to try the latest changes in Compose Hot Reload, you can usedev builds. To use the latest 'dev' builds ofCompose Hot Reload, add thefirework Maven repository in yoursettings.gradle.kts file:

pluginManagement {    repositories {        maven("https://packages.jetbrains.team/maven/p/firework/dev")    }}dependencyResolutionManagement {    repositories {        maven("https://packages.jetbrains.team/maven/p/firework/dev")    }}

Compose Hot Reload is designed to work with Compose Multiplatform. To use Compose Hot Reload with an Android-onlyproject, you need to:

• Switch from the Jetpack Compose plugin to the Compose Multiplatform plugin.
• Add a separate Gradle module and configure the JVM target accordingtothe instructions.

Yes! However, be aware that you can't start the application via the run button in thegutter (CMP-3123). Instead, useGradle tasks.