Compose中的Card

在 Android Jetpack Compose 中，Card 是一个常见的组件，用于显示包含内容（如文本、图像等）的矩形卡片。Card 组件具有阴影和圆角，可以为界面提供清晰的视觉层次感和焦点。

基本特性

1. 形状：Card 组件默认是矩形的，但可以通过设置 shape 属性来改变其形状。
2. 阴影：Card 组件默认具有轻微的阴影效果，这可以通过调整 elevation 属性来改变阴影的深度。
3. 内容：Card 组件内部可以包含任何 Compose 组件，如 Text、Image 等。
4. 大小：Card 的大小由其内部内容及其修饰符（Modifier）决定。

使用方法

在 Compose 中使用 Card，你需要将其包含在布局中，并为其添加适当的修饰符和内容。

示例代码

下面是一个使用 Compose 创建 Card 的示例代码：

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material.Card
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@Composable
fun MyCardExample() {
    Box(
        modifier = Modifier.fillMaxSize(),
        contentAlignment = Alignment.Center
    ) {
        Card(
            modifier = Modifier
                .padding(16.dp) // 外部边距
                .padding(8.dp) // 内部边距（可选，用于增加卡片内部空间）
                .size(200.dp) // 设置卡片大小（可选）
        ) {
            Column(
                modifier = Modifier
                    .padding(16.dp) // 内容边距
            ) {
                Text(
                    text = "这是一个 Card 示例",
                    style = MaterialTheme.typography.h6, // 使用主题中的样式
                    modifier = Modifier.align(Alignment.CenterHorizontally) // 水平居中
                )

                // 这里可以添加更多的内容，如 Image、Button 等
            }
        }
    }
}

在这个示例中，我们创建了一个居中的 Card，它包含了一个垂直排列的 Column 布局，其中包含了一个 Text 组件。你可以根据需要向 Card 中添加更多的内容。

注意：上述代码示例假设你已经正确设置了 Compose 和 Material 组件库的依赖，并且你的项目已经配置了相应的 Compose 主题（如 MaterialTheme）。如果你还没有设置这些，你需要先完成这些步骤才能正确运行示例代码。