Jetpack Compose 是 Android 开发中用于构建原生 UI 的现代化工具包。它使 UI 开发更加直观,并允许您以声明性方式构建 UI。以下是一些关于 Jetpack Compose 的基本教程内容。
基础概念
- 声明式 UI: 与传统的基于事件的 UI 相比,声明式 UI 允许您通过描述 UI 的最终状态来构建 UI,而不是通过编写事件处理程序来控制 UI 的行为。
- 组件: Jetpack Compose 使用组件来构建 UI。每个组件负责渲染自己的内容并处理用户交互。
快速开始
- 添加依赖: 在您的
build.gradle
文件中添加以下依赖:
dependencies {
implementation 'androidx.compose.ui:ui:1.0.0'
// 其他必要的依赖
}
- 创建一个简单的组件:
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.size
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
@Composable
fun SimpleText() {
Box {
Text(text = "Hello, Jetpack Compose!")
}
}
- 在 Activity 中使用 Compose:
import androidx.appcompat.app.AppCompatActivity
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.ComposeView
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(ComposeView(this).apply {
setContent {
MyScreen()
}
})
}
}
@Composable
fun MyScreen() {
Box(modifier = Modifier.fillMaxSize()) {
Text(text = "Hello, Jetpack Compose!", modifier = Modifier.size(200.dp))
}
}
@Preview
@Composable
fun PreviewMyScreen() {
MyScreen()
}
资源
Android Compose Logo