Compose基础控件使用-Text、TextField、Image、Row、Column、Card、Button

/**
 * Author : wn
 * Email : maoning20080809@163.com
 * Date : 2026/1/1 10:11
 * Description : 基本的UI控件
 */
class BaseUIActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            baseUiScreen()
        }
    }

    @Composable
    fun baseUiScreen(){
        var textFieldValue by remember { mutableStateOf("") }
        Column(
            modifier = Modifier.fillMaxSize(),
            horizontalAlignment = Alignment.CenterHorizontally,
            verticalArrangement = Arrangement.Center,
        ) {
            Text(text = "Compose基础控件使用",
                fontSize = 22.sp,
                fontWeight = FontWeight.Bold,
                fontStyle = FontStyle.Italic,
                color = Color.Green,
                letterSpacing = 8.sp
            )
            Spacer(modifier = Modifier.height(30.dp))
            TextField(value = textFieldValue,
                onValueChange = {newText ->
                    textFieldValue = newText
                },
                label = {Text("测试编辑框TextField")}
            )
            Spacer(modifier = Modifier.height(30.dp))
            Image(
                modifier = Modifier.size(120.dp,120.dp),
                painter = painterResource(R.mipmap.a),
                contentDescription = "测试图片"
            )
            Spacer(modifier = Modifier.height(30.dp))
            Row(horizontalArrangement = Arrangement.Start) {
                Text("Row1", modifier = Modifier.weight(1f).padding(start = 20.dp))
                Text("Row2", modifier = Modifier.weight(1f))
                Text("Row3", modifier = Modifier.weight(2f))
            }
            Spacer(modifier = Modifier.height(30.dp))
            Column(
                modifier = Modifier.fillMaxWidth().padding(end = 30.dp),
                horizontalAlignment = Alignment.End) {
                Text("Column1")
                Text("Column222")
                Text("Column33333")
            }
            Spacer(modifier = Modifier.height(30.dp))
            Card(
                modifier = Modifier.padding(30.dp).width(200.dp),
                shape = RoundedCornerShape(60.dp),
                elevation = CardDefaults.cardElevation(defaultElevation = 20.dp)
            ) {
                Box(modifier = Modifier.fillMaxWidth().padding(16.dp),
                    contentAlignment = Alignment.Center
                ){
                    Text("卡片使用Card")
                }
            }
            Button(onClick = {
                finish()
            }) {
                Text(text = "返回按钮")
            }
        }
    }

    @Preview(showBackground = true)
    @Composable
    fun DefaultPreview() {
        AndroidComposeDemo1Theme {
            baseUiScreen()
        }
    }
}