Compose Multiplatform 桌面应用模板教程

Compose Multiplatform 桌面应用模板教程

compose-multiplatform-desktop-templateCompose Multiplatform Desktop Application project template项目地址:https://gitcode.com/gh_mirrors/co/compose-multiplatform-desktop-template

1. 项目的目录结构及介绍

compose-multiplatform-desktop-template/
├── gradle/
│   └── wrapper/
├── readme_images/
├── src/
│   └── main/
│       └── kotlin/
├── .gitignore
├── LICENSE.txt
├── README.md
├── build.gradle.kts
├── gradle.properties
├── gradlew
├── gradlew.bat
├── settings.gradle.kts

• gradle/：包含 Gradle 包装器文件。
• readme_images/：包含 README 文件中使用的图片。
• src/：项目的源代码目录。
  • main/：主代码目录。
    • kotlin/：Kotlin 源代码文件。
• .gitignore：Git 忽略文件配置。
• LICENSE.txt：项目许可证文件。
• README.md：项目说明文档。
• build.gradle.kts：Gradle 构建脚本。
• gradle.properties：Gradle 属性配置文件。
• gradlew：Gradle 包装器脚本（Unix）。
• gradlew.bat：Gradle 包装器脚本（Windows）。
• settings.gradle.kts：Gradle 设置脚本。

2. 项目的启动文件介绍

项目的启动文件位于 src/main/kotlin/ 目录下，通常命名为 main.kt。以下是示例代码：

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)
    ) {
        MaterialTheme {
            Column(
                modifier = Modifier.fillMaxSize(),
                verticalArrangement = Arrangement.Center,
                horizontalAlignment = Alignment.CenterHorizontally
            ) {
                val count = remember { mutableStateOf(0) }
                Text("Counter: ${count.value}")
                Button(onClick = { count.value++ }) {
                    Text("Increment")
                }
            }
        }
    }
}

该文件定义了应用的入口点，并使用 Compose 创建了一个简单的桌面应用界面。

3. 项目的配置文件介绍

build.gradle.kts

这是项目的 Gradle 构建脚本，定义了项目的依赖、插件和其他构建配置。

plugins {
    id("org.jetbrains.compose") version "1.0.0"
    id("com.android.application")
    kotlin("android")
}

dependencies {
    implementation(compose.desktop.currentOs)
}

android {
    compileSdkVersion(30)
    defaultConfig {
        applicationId = "com.example.compose"
        minSdkVersion(24)
        targetSdkVersion(30)
        versionCode = 1
        versionName = "1.0"
    }
    buildTypes {
        getByName("release") {
            isMinifyEnabled = false
        }
    }
}

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

settings.gradle.kts

这是 Gradle 的设置脚本，定义了项目的名称和子项目。

rootProject.name = "compose-multiplatform-desktop-template"

gradle.properties

这是 Gradle

compose-multiplatform-desktop-templateCompose Multiplatform Desktop Application project template项目地址:https://gitcode.com/gh_mirrors/co/compose-multiplatform-desktop-template