android - 如何在运行时添加 texdfields 并在 android jetpack compose 中管理这些文本字段值？

Question

我想使用 jetpack compose创建一个Rate List应用程序。价格表有不同的项目，每个项目根据重量有不同的价格。例如苹果（物品）1 公斤的价格是 100 卢比，5 公斤的价格是 400 卢比等。像苹果一样，不同的物品有不同的价格和重量。问题是如何在 rumtime 创建文本字段并管理这些重量和价格值。我试试这个喷气背包编写代码

@compose 
fun ComposeTextFields() {
var weightTextField = remember {
    mutableStateListOf<String>()
}
var priceTextField by remember {
    mutableStateOf("")
}
var number by remember {
    mutableStateOf(0)
}
Column {
    LazyColumn {
        items(number){
            Row {
                OutlinedTextField(
                    value = weightTextField[number-1],
                    onValueChange = { weightTextField.add(number-1, it) },
                    label = { Text(text = "Weight") },
                    modifier = Modifier.weight(1f)
                )
                OutlinedTextField(
                    value = priceTextField,
                    onValueChange = {priceTextField = it },
                    label = { Text(text = "Price")},
                    modifier = Modifier
                        .weight(1f)
                        .padding(start = 5.dp)
                )
            }
        }
        item {
            TextButton(onClick = { ++number }) {
                Text("more $number")
            }
        }
    }
  }
}

输出屏幕

请解决这个问题

Answer 1

这是你的代码工作:)

@Composable
fun ComposeTextFields() {
    val weightTextField = remember {
        mutableStateListOf<String>()
    }
    val priceTextField = remember {
        mutableStateListOf<String>()
    }
    var number by remember {
        mutableStateOf(0)
    }
    Column {
        LazyColumn {
            items(number) { index ->
                Row {
                    OutlinedTextField(
                        value = weightTextField[index],
                        onValueChange = { weightTextField[index] = it },
                        label = { Text(text = "Weight") },
                        modifier = Modifier.weight(1f)
                    )
                    OutlinedTextField(
                        value = priceTextField[index],
                        onValueChange = {
                            priceTextField[index] = it
                        },
                        label = { Text(text = "Price") },
                        modifier = Modifier
                            .weight(1f)
                            .padding(start = 5.dp)
                    )
                }
            }
            item {
                TextButton(onClick = {
                    ++number
                    weightTextField.add("100g")
                    priceTextField.add("100")
                }) {
                    Text("more $number")
                }
            }
        }
    }
}