Compose Multiplatform desktop application
Note If you face any issues, please report them on GitHub.
Compose for Desktop can produce applications for macOS, Linux, and Windows platforms. You can use any of these platforms with our template.
Follow our tutorial below to create a simple desktop application using the Compose Multiplatform UI framework.
If you want to create an application targeting mobile platforms – iOS and Android, use the Compose Multiplatform mobile application template.
Install the following tools:
-
JDK 11 or later
-
IntelliJ IDEA Community or Ultimate Edition 2020.3 or later (other editors could also work, but we're using IntelliJ IDEA in this tutorial)
-
Compose Multiplatform IDE support plugin
It helps to simplify compose development by adding support for the
@Preview
annotation on argument-less@Composable
functions. The plugin shows how a particular composable function looks directly in the IDE.
Starting with 2020.3, IntelliJ IDEA comes with the new project wizard that can automatically create a Compose application.
Note When creating a project, select JDK 11 or later. To use the native distribution packaging, select JDK 15 or later.
Before you start, ensure that you use the latest version of the Compose Multiplatform IDE support plugin:
-
Check the latest release version in the Compose Multiplatform GitHub repository or on the Kotlin website.
-
Open the
build.gradle.kts
file of your project and update the version:plugins { kotlin("jvm") version "1.8.20" id("org.jetbrains.compose") version "1.4.0" }
It is also possible to create a Compose project manually in the terminal.
We recommended building Compose for Desktop projects with Gradle. JetBrains provides a simple way of building such projects using a special Gradle plugin.
Note You can clone the existing template for a desktop or multiplatform application or create it from scratch.
-
Create a new directory named
sample
:mkdir sample cd sample
-
Create the
settings.gradle.kts
file and update it as follows:pluginManagement { repositories { gradlePluginPortal() maven("https://maven.pkg.jetbrains.space/public/p/compose/dev") } }
-
Create the
build.gradle.kts
file with the following content:plugins { kotlin("jvm") version "1.8.20" id("org.jetbrains.compose") version "1.4.0" } repositories { mavenCentral() maven("https://maven.pkg.jetbrains.space/public/p/compose/dev") google() } dependencies { implementation(compose.desktop.currentOs) } compose.desktop { application { mainClass = "MainKt" } }
-
Create
src/main/kotlin/main.kt
and add the following code to it:import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material.Button import androidx.compose.material.MaterialTheme import androidx.compose.material.Text import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.unit.dp import androidx.compose.ui.window.Window import androidx.compose.ui.window.application import androidx.compose.ui.window.rememberWindowState fun main() = application { Window( onCloseRequest = ::exitApplication, title = "Compose for Desktop", state = rememberWindowState(width = 300.dp, height = 300.dp) ) { val count = remember { mutableStateOf(0) } MaterialTheme { Column(Modifier.fillMaxSize(), Arrangement.spacedBy(5.dp)) { Button(modifier = Modifier.align(Alignment.CenterHorizontally), onClick = { count.value++ }) { Text(if (count.value == 0) "Hello World" else "Clicked ${count.value}!") } Button(modifier = Modifier.align(Alignment.CenterHorizontally), onClick = { count.value = 0 }) { Text("Reset") } } } } }
You can run and debug the application by clicking Run in the gutter near the main()
function declaration:
-
In IntelliJ IDEA, open
build.gradle.kts
. When the necessary dependencies from the Maven repositories are downloaded, your project is ready. -
In the Gradle tool window, select
sample/Tasks/compose desktop/run
:The first run may take some time.
-
Click the button several times and see that the application reacts and updates the UI:
You can also run Gradle tasks in the terminal:
./gradlew run
to run the application./gradlew package
to store native distribution intobuild/compose/binaries
We encourage you to explore Compose Multiplatform further and try out more projects: