使用 Jetpack Compose 在单击按钮时动态添加视图
Dynamically add views on click of Button using Jetpack Compose
我想在每次用户单击“添加”时将文本字段动态添加到我的布局中button.Added 文本字段应添加到“添加”按钮上方。i.e.between 步骤 1 文本字段和添加 Button.How 这可以通过 Jetpack Compose 实现吗?下面是截图,后面是我当前的代码..
代码-
Column(modifier = Modifier.padding(16.dp)) {
OutlinedTextField(
modifier = Modifier.fillMaxWidth(),
value = step1,
onValueChange = {
viewModel.onStep1Changed(it)
},
label = {
Text(text = "Step 1...")
},
shape = RoundedCornerShape(8.dp),
colors = TextFieldDefaults.textFieldColors(
backgroundColor = Color.Transparent),
trailingIcon = {
Icon(
modifier = Modifier.padding(start=10.dp),
imageVector = Icons.Filled.Image,
tint= Color.Blue,
contentDescription = "Select Image"
)
}
)
Spacer(modifier = Modifier.height(16.dp))
Button(onClick = {
//TODO Dynamically add text fields
}){
Text("Add")
}
}
Column(modifier = Modifier.padding(16.dp)) {
val textFieldCount by remember { mutableStateOf (1) }
repeat(textFieldCount) {
OutlinedTextField(
modifier = Modifier.fillMaxWidth(),
value = step1,
onValueChange = {
viewModel.onStep1Changed(it)
},
label = {
Text(text = "Step 1...")
},
shape = RoundedCornerShape(8.dp),
colors = TextFieldDefaults.textFieldColors(
backgroundColor = Color.Transparent),
trailingIcon = {
Icon(
modifier = Modifier.padding(start=10.dp),
imageVector = Icons.Filled.Image,
tint= Color.Blue,
contentDescription = "Select Image"
)
}
)
Spacer(modifier = Modifier.height(16.dp))
}
Button(onClick = {
textFieldCount++
}){
Text("Add")
}
}
我想在每次用户单击“添加”时将文本字段动态添加到我的布局中button.Added 文本字段应添加到“添加”按钮上方。i.e.between 步骤 1 文本字段和添加 Button.How 这可以通过 Jetpack Compose 实现吗?下面是截图,后面是我当前的代码..
代码-
Column(modifier = Modifier.padding(16.dp)) {
OutlinedTextField(
modifier = Modifier.fillMaxWidth(),
value = step1,
onValueChange = {
viewModel.onStep1Changed(it)
},
label = {
Text(text = "Step 1...")
},
shape = RoundedCornerShape(8.dp),
colors = TextFieldDefaults.textFieldColors(
backgroundColor = Color.Transparent),
trailingIcon = {
Icon(
modifier = Modifier.padding(start=10.dp),
imageVector = Icons.Filled.Image,
tint= Color.Blue,
contentDescription = "Select Image"
)
}
)
Spacer(modifier = Modifier.height(16.dp))
Button(onClick = {
//TODO Dynamically add text fields
}){
Text("Add")
}
}
Column(modifier = Modifier.padding(16.dp)) {
val textFieldCount by remember { mutableStateOf (1) }
repeat(textFieldCount) {
OutlinedTextField(
modifier = Modifier.fillMaxWidth(),
value = step1,
onValueChange = {
viewModel.onStep1Changed(it)
},
label = {
Text(text = "Step 1...")
},
shape = RoundedCornerShape(8.dp),
colors = TextFieldDefaults.textFieldColors(
backgroundColor = Color.Transparent),
trailingIcon = {
Icon(
modifier = Modifier.padding(start=10.dp),
imageVector = Icons.Filled.Image,
tint= Color.Blue,
contentDescription = "Select Image"
)
}
)
Spacer(modifier = Modifier.height(16.dp))
}
Button(onClick = {
textFieldCount++
}){
Text("Add")
}
}