Как добавлять текстовые поля во время выполнения и управлять значениями этих текстовых полей в Android jetpack compose?

#android #kotlin #textfield #android-jetpack-compose #lazycolumn

Вопрос:

Я хочу создать приложение для составления списка ставок с помощью jetpack compose. В списке цен есть разные товары, и каждый товар имеет разную цену в зависимости от веса. Например, Яблоко(товары) цена 1 кг составляет 100 рублей, а за 5 кг цена составляет 400 рублей и т.д. Как и у apple, разные товары имеют разную цену и вес. Проблема в том, как создать текстовое поле во время просмотра и управлять этими значениями веса и цены. Я пробую этот код для создания реактивного ранца

 @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")
            }
        }
    }
  }
}
 

Выходной экран

Экран вывода моей попытки

Пожалуйста, решите эту проблему

Комментарии:

1. Ваш код вылетает, когда я нажимаю на кнопку

Ответ №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")
                }
            }
        }
    }
}