compose-desktopmaterial3

How to use Material 3 Theme and Components in Compose Desktop?


I want to use material 3 theme and components in a compose desktop project. I want to achieve the same as the default Empty Activity in an android studio project, where the theme, color scheme, and other components are using material 3 style by default.

After adding the dependencies from the following stackoverflow question, I managed to import the material 3 component. However, the style used in these components are still using material 2 style.

Here, this is my button and text field.

enter image description here

This is my build.gradle.kts file :

import org.jetbrains.compose.desktop.application.dsl.TargetFormat

plugins {
    kotlin("jvm")
    id("org.jetbrains.compose")
}

group = "com.example"
version = "1.0-SNAPSHOT"

repositories {
    mavenCentral()
    maven("https://maven.pkg.jetbrains.space/public/p/compose/dev")
    google()
}

dependencies {
    implementation(compose.desktop.currentOs)
    implementation(compose.material3)
    implementation(compose.materialIconsExtended)
}

compose.desktop {
    application {
        mainClass = "MainKt"

        nativeDistributions {
            targetFormats(TargetFormat.Dmg, TargetFormat.Msi, TargetFormat.Deb)
            packageName = "WebViewApp"
            packageVersion = "1.0.0"
        }
    }
}

Solution

  • from @ubertrombone reply, I found out that I imported the wrong package, here is the import prompt and the results :

    enter image description here

    It should be the androidx.compose.material3 instead of androidx.compose.material