Compose 基本语法

启动入口


/*
 main函数运行

 */
fun main() =
    //An entry point for the Compose application.
    // 启动函数
    application {
        // window
    Window(title = "first demo",
        onCloseRequest = ::exitApplication,
        ) {
        // window > 组件
        App()
    }
}

组件


/**
 * @Composable 组件注解 给函数加上注解就代表一个页面组件
 * @Preview 可以借助IDEA上的插件进行组件预览
 */
@Composable
@Preview
fun App() {

    // 计算 状态 当值变化并需要页面变得时会重新运行相关作用域代码的这个组件
    var text by remember { mutableStateOf("Hello, World!") }
    println("app scope")
    MaterialTheme {
        Button(onClick = {
            text = "Hello, Desktop!"
        }) {
            println("text scope")
            Text(text)
        }
    }
}

Idea 预览效果

image1