Desktop application with Jetpack Compose

We live exciting moments !

No I’m not talking about lockdown or election day but the amazing news that Jetpack Compose on desktop is now accessible on EAP version of Intellij IDEA.

Have a look on what it is and how to use it.

Sample template

When we launch Intellij IDEA, a sample template is provided for taking your first step with Compose on desktop.

fun main() = Window {
    var text by remember { mutableStateOf("Hello, World!") }

    MaterialTheme {
        Button(onClick = {
            text = "Hello, Desktop!"
        }) {
            Text(text)
        }
    }
}

Note there is only a new Window keyword that is making it magic. All the rest is basic Jetpack Compose.

import androidx.compose.desktop.Window

Window { ... }

My previous example with list

Let’s see how to port in desktop the example of a basic list in compose . It’s just reusing all Android composable functions.

fun main() = Window {
   var text by remember { mutableStateOf("Hello, World!") }

   MaterialTheme {
       ListComponent((0..100).map { "item$it" })
   }
}

@Composable
fun ListComponent(dataset: List<String>) {
   LazyColumnFor(items = dataset) { item ->
       Text(text = item, modifier = Modifier.padding(8.dp))
   }
}

Little bit more complicated UI

I made this UI on desktop, this is just an UI and there is no feature. It was inspired by this dribble.

You can find the code here.

Conclusion

Under the hood Jetbrains Compose is based on Skia and it seems that the next compatible platform could be iOS, it would be awesome.

Compose on desktop is already available on Windows, Linux and mac OS.

Jetbrains just announced Milestone 1 released and they said that more effort will be put on Kotlin multiplatform in near future.

I can’t wait to see the evolution of this amazing technology !