我有一个表单,用户需要从下拉列表中选择一个项目,然后在文本字段中输入该项目的权重。现在,我想添加一个按钮,单击该按钮将添加另一组下拉列表和“输入”字段,以便用户可以选择更多项目并输入相应项目的权重。如何在Flutter应用程序中实现这一点?
这就是我的代码现在的样子。
class _CheckOutPageState extends State<CheckOutPage> {
String uid;
String key;
_CheckOutPageState(this.key);
String _currentItemSelected = "Paper";
var _items = ['paper', 'Books', 'Pens', 'Markers'];
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView(
padding: EdgeInsets.all(20.0),
children: <Widget>[
Divider(height: 50,),
Center(
child:Text(
"Check Out",
style: TextStyle(
fontSize: 40,
color: new Color(0xfffff8f43),
fontWeight: FontWeight.bold
),
)
),
Divider(height: 50,),
Center(child: Text("Select the List of Items")),
Divider(height: 50,),
Card(
elevation: 10,
child: Padding(
padding: EdgeInsets.all(20.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
DropdownButton<String>(
items: _items.map((String dropDownStringItem){
return DropdownMenuItem<String>(
value: dropDownStringItem,
child: Text(dropDownStringItem),
);
}).toList(),
onChanged: (String newValueSelected){
setState(() {
this._currentItemSelected = newValueSelected;
});
},
value: _currentItemSelected,
),
TextField(
decoration: InputDecoration(
labelText: "Enter Weight"
),
),
],
),
)
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
RaisedButton(
child: Text("Done", style: TextStyle(color: Colors.white),),
color: new Color(0xfffff8f43),
onPressed: (){
},
),
RaisedButton(
child: Text("Back", style: TextStyle(color: Colors.white),),
color: new Color(0xfffff8f43),
onPressed: (){
Navigator.of(context).pop();
},
),
],
),
],
),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
elevation: 10.0,
backgroundColor: new Color(0xfffff8f43),
onPressed: (){
},
),
);
}
}
每当用户按下floatingActionButton
时,我都想添加Card
中的任何内容。