我是新手,我正在尝试构建一个相当简单的应用程序。我有这个简单的代码(仍在进行中),我试图在用户每次单击按钮时添加一个新的小部件。
这是我的代码:
class ResponsavelProfilePage extends StatefulWidget { @override _ResponsavelProfilePageState createState() => new _ResponsavelProfilePageState(); } class _ResponsavelProfilePageState extends State<ResponsavelProfilePage> { int _count = 1; @override Widget build(BuildContext context) { List<Widget> _contatos = new List.generate(_count, (int i) => new ContactRow()); return new Scaffold( appBar: new AppBar( title: new Text(GlobalConstants.appName), ), body: new LayoutBuilder(builder: (context, constraint) { final _maxHeight = constraint.biggest.height / 3; final _biggerFont = TextStyle(fontSize: _maxHeight / 6); return new Center( child: new Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ new TextFormField( decoration: new InputDecoration( labelText: 'Nome', ), ), new Container( padding: new EdgeInsets.all(20.0), ), new TextFormField( decoration: new InputDecoration( labelText: 'Data de nascimento', ), ), new Container( padding: new EdgeInsets.all(20.0), ), new Row( children: _contatos, ), new FlatButton( onPressed: _addNewContactRow, child: new Icon(Icons.add), ), //new ContactRow() ], ), ); }) ); } void _addNewContactRow() { setState(() { _count = _count + 1; }); } } class ContactRow extends StatefulWidget { @override State<StatefulWidget> createState() => new _ContactRow(); } class _ContactRow extends State<ContactRow> { @override Widget build(BuildContext context) { return new Container( child: new Column( children: <Widget>[ new TextFormField( decoration: new InputDecoration( labelText: 'Contato', ), ), new Text("Tipo Contato: "), new DropdownButton( value: _currentContactType, items: _dropDownMenuItems, onChanged: changedDropDownItem, ), new Container( padding: new EdgeInsets.all(20.0), ), ] ) ); } List _contactTypes = ["Phone (SMS)", "Phone (Whatsapp)", "Email"]; List<DropdownMenuItem<String>> _dropDownMenuItems; String _currentContactType; @override void initState() { _dropDownMenuItems = getDropDownMenuItems(); _currentContactType = null; super.initState(); } List<DropdownMenuItem<String>> getDropDownMenuItems() { List<DropdownMenuItem<String>> items = new List(); for (String city in _contactTypes) { items.add(new DropdownMenuItem( value: city, child: new Text(city) )); } return items; } void changedDropDownItem(String selectedCity) { setState(() { _currentContactType = selectedCity; }); } }
当用户在onPressed上使用addNewContactRow()单击该平面按钮时,我想添加另一个ContactRow 。我在addNewContactRow()上找到了代码,在 这里的另一个问题上找到了List.generate部分,但是我无法使其正常工作。
有人可以帮忙吗?
只需用ListView替换Row。
还对高度/宽度进行了一些更改,将其签出。
import 'package:flutter/material.dart'; void main() => runApp( new MaterialApp( home: new ResponsavelProfilePage(), ), ); class ResponsavelProfilePage extends StatefulWidget { @override _ResponsavelProfilePageState createState() => new _ResponsavelProfilePageState(); } class _ResponsavelProfilePageState extends State<ResponsavelProfilePage> { int _count = 1; @override Widget build(BuildContext context) { List<Widget> _contatos = new List.generate(_count, (int i) => new ContactRow()); return new Scaffold( appBar: new AppBar( title: new Text("NonstopIO"), ), body: new LayoutBuilder(builder: (context, constraint) { final _maxHeight = constraint.biggest.height / 3; final _biggerFont = TextStyle(fontSize: _maxHeight / 6); return new Center( child: new Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ new TextFormField( decoration: new InputDecoration( labelText: 'Nome', ), ), new Container( padding: new EdgeInsets.all(20.0), ), new TextFormField( decoration: new InputDecoration( labelText: 'Data de nascimento', ), ), new Container( padding: new EdgeInsets.all(20.0), ), new Container( height: 200.0, child: new ListView( children: _contatos, scrollDirection: Axis.horizontal, ), ), new FlatButton( onPressed: _addNewContactRow, child: new Icon(Icons.add), ), //new ContactRow() ], ), ); })); } void _addNewContactRow() { setState(() { _count = _count + 1; }); } } class ContactRow extends StatefulWidget { @override State<StatefulWidget> createState() => new _ContactRow(); } class _ContactRow extends State<ContactRow> { @override Widget build(BuildContext context) { return new Container( width: 170.0, padding: new EdgeInsets.all(5.0), child: new Column(children: <Widget>[ new TextFormField( decoration: new InputDecoration( labelText: 'Contato', ), ), new Text("Tipo Contato: "), new DropdownButton( value: _currentContactType, items: _dropDownMenuItems, onChanged: changedDropDownItem, ), new Container( padding: new EdgeInsets.all(20.0), ), ])); } List _contactTypes = ["Phone (SMS)", "Phone (Whatsapp)", "Email"]; List<DropdownMenuItem<String>> _dropDownMenuItems; String _currentContactType; @override void initState() { _dropDownMenuItems = getDropDownMenuItems(); _currentContactType = null; super.initState(); } List<DropdownMenuItem<String>> getDropDownMenuItems() { List<DropdownMenuItem<String>> items = new List(); for (String city in _contactTypes) { items.add(new DropdownMenuItem(value: city, child: new Text(city))); } return items; } void changedDropDownItem(String selectedCity) { setState(() { _currentContactType = selectedCity; }); } }