Issue
I want the text fields of this form to appear on the screen one by one, as the user submits the data.
For e.g., as is shown in the image below.
Solution
Update using list
List<TextEditingController> controllers = [TextEditingController()];
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
...List.generate(
controllers.length,
(index) => TextField(
autofocus: true,
controller: controllers[index],
onSubmitted: (v) {
controllers.add(TextEditingController());
setState(() {});
},
),
),
],
),
);
}
You can create a bool
on state and use it to control visibility of email TextFiled
bool showEmailField = false;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Column(
children: [
TextField(
onSubmitted: (value) {
print("call Next one");
setState(() {
showEmailField = true;
});
},
),
if (showEmailField) TextField(),
],
),
);
}
For animation, you can use ScaleTransition
. For more widgets, you can create list and use conditional state to generate widgets under build method.
Answered By - Yeasin Sheikh
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.