I am trying to collect multiple form data in a list and then pass the list to different screen.
The problem is, list contains only the data from last form
Here is the code :
class _MyHomePageState extends State<MyHomePage> {
Map<String, dynamic> _formdata ={};
List _collection =[];
void _addcollections() {
setState(() {
_collection =List.from(_collection)
..add(_formdata);
});
print(_collection);
}
InputDecoration _decoration({String hint}) {
return InputDecoration(
hintText: hint,
labelText: hint,
border: OutlineInputBorder(
gapPadding: 4,
borderRadius: BorderRadius.circular(4),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextField(
decoration: _decoration(hint: 'Name'),
onChanged: (val)=>_formdata['name']=val,
),
TextField(
decoration: _decoration(hint: 'Age'),
onChanged: (val)=>_formdata['age']=val,
),
TextField(
decoration: _decoration(hint: 'Sex'),
onChanged: (val)=>_formdata['sex']=val,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _addcollections,
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
I am printing the content of my list collection and this is the result i get.
first fab click: [{name: a, age: 1, sex: m}]
second fab click: [{name: b, age: 2, sex: f}, {name: b, age: 2, sex: f}]
Solution 1: android
If you want add form data to a list multiple times then you can do as below:
First create User model as below:
class User {
String name;
String age;
String sex;
User({
this.name,
this.age,
this.sex,
});
factory User.fromJson(Map<String, dynamic> json) => new User(
name: json["name"],
age: json["age"],
sex: json["sex"],
);
Map<String, dynamic> toJson() => {
"name": name,
"age": age,
"sex": sex,
};
}
Then below is the example with listview that will display list of users dynamically by click on add button
import 'package:flutter/material.dart';
import 'package:flutter_app/models/User.dart';
class MyFormAddList extends StatefulWidget {
createState() {
return StateKeeper();
}
}
class StateKeeper extends State<MyFormAddList> {
final _formKey = GlobalKey<FormState>();
List<User> userList = new List();
User user = new User();
InputDecoration _decoration({String hint}) {
return InputDecoration(
hintText: hint,
labelText: hint,
border: OutlineInputBorder(
gapPadding: 4,
borderRadius: BorderRadius.circular(4),
),
);
}
void _addcollections(User user) {
setState(() {
userList.add(user);
this.user = new User();
});
}
@override
Widget build(BuildContext context) {
return Container(
color: Colors.white,
child: Center(
child: Form(
key: _formKey,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
TextField(
decoration: _decoration(hint: 'Name'),
onChanged: (val)=>user.name = val,
),
TextField(
decoration: _decoration(hint: 'Age'),
onChanged: (val)=>user.age = val,
),
TextField(
decoration: _decoration(hint: 'Sex'),
onChanged: (val)=>user.sex = val,
),
],
),
Container(
height: 200.0,
child: ListView.builder(
itemCount: userList.length,
itemBuilder: (context, index) {
return Card(
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Text("Name: " + userList[index].name
+ ", Age: " + userList[index].age
+ ", Sex: " + userList[index].sex
, style: TextStyle(fontSize: 22.0),),
),
);
},),
),
Padding(
padding: const EdgeInsets.only(top: 50),
),
ButtonTheme(
minWidth: 200,
height: 50,
child: RaisedButton(
onPressed: () => _addcollections(user),
child: Text('Add User', style: new TextStyle(fontSize: 20),), textColor: Colors.white,
color: Colors.blue,
shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0)),
),
),
],
),
),
),
);
}
}