Как добавить поля при нажатии кнопки во флаттере

как добавить текстовое поле, когда я нажимаю кнопку добавления. который находится на панели приложений. когда я нажимаю кнопку «Добавить», он добавит ЧЕТЫРЕ поля, которые я уже создал в этом примере кода, который я пробовал. Так что, пожалуйста, кто-нибудь может помочь. Ваша помощь может сделать мой день :).

в этом коде есть четыре таких поля. _buildidentificationtype1,_builddocumentnumber1,_buildexpirydate1,_buildissuingauthority1 Я хочу сгенерировать эти четыре поля, когда я нажимаю кнопку добавления.

import 'dart:io';

import 'package:datetime_picker_formfield/datetime_picker_formfield.dart';
import 'package:flutter/material.dart';
import 'package:flutter_form_builder/flutter_form_builder.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:image_picker/image_picker.dart';
import 'package:intl/intl.dart';
import 'package:tudo/src/modules/bsp_signup/bsp_licensed_signup_terms/bsp_licensed_signup_terms_page.dart';
import 'package:tudo/src/modules/bsp_signup/bsp_signup_common_model.dart';
import 'package:tudo/src/styles/colors.dart';

import 'package:tudo/src/utils/navigation_helper.dart';
import 'package:tudo/src/utils/validator.dart';
import 'package:tudo/src/widgets/tudo_selection_widget/TudoConditionWidget.dart';
import 'package:tudo/src/widgets/tudo_text_widget/TudoTextWidget.dart';

class BspUnlicensedSignupPage extends StatefulWidget {
  static const String routeName = "/bspUnlicensedSignup";
  final BspSignupCommonModel bspSignupCommonModel;

  BspUnlicensedSignupPage({
    Key key,
    @required this.bspSignupCommonModel,
  }) : super(key: key);

  @override
  _BspUnlicensedSignupPageState createState() =>
      _BspUnlicensedSignupPageState();
}

class _BspUnlicensedSignupPageState extends State<BspUnlicensedSignupPage> {
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  List<Object> images = List<Object>();
  Future<File> _imageFile;
  @override
  void initState() {
    super.initState();
    debugPrint(
        'BSP SIGNUP DATA: ${widget.bspSignupCommonModel.businessPhoneNo}');
    debugPrint('BSP SIGNUP DATA: ${widget.bspSignupCommonModel.businessYear}');
    debugPrint(
        'BSP SIGNUP DATA: ${widget.bspSignupCommonModel.numberofEmployees}');
    debugPrint('BSP SIGNUP DATA: ${widget.bspSignupCommonModel.businessType}');
    debugPrint(
        'BSP SIGNUP DATA: ${widget.bspSignupCommonModel.businessLegalName}');
    setState(() {
      images.add("Add Image");
      images.add("Add Image");
      images.add("Add Image");
      images.add("Add Image");
      images.add("Add Image");
    });
  }

  bool informationislegitimate = false;
  DateTime expirydate1 = DateTime.now();
  DateTime expirydate2 = DateTime.now();

  final format = DateFormat("yyyy-MM-dd");
  final format2 = DateFormat("yyyy-MM-dd");
  final TextEditingController clrbusinesslicense = TextEditingController();
  final TextEditingController clrbusinesslicense2 = TextEditingController();
  final TextEditingController clrissuingauthority = TextEditingController();
  final TextEditingController clrissuingauthority2 = TextEditingController();
  String _licenseno;
  String _licenseno2;
  String illusingauthority;
  String illusingauthority2;
  List<String> _type2 = <String>[
    'Passport',
    'Driving License',
    'Voter ID card',
    'Ration Card',
    'Aadhar'
        'Other Id'
  ];
  String type2 = 'Passport';
  List<String> _type = <String>[
    'Passport',
    'Driving License',
    'Voter ID card',
    'Ration Card',
    'Aadhar'
        'Other Id'
  ];
  String type = 'Passport';
  Map<String, String> _formdata = {};
  var _myPets = List<Widget>();
  int _index = 1;

  void _add() {
    int keyValue = _index;
    _myPets = List.from(_myPets)
      ..add(Column(
        key: Key("${keyValue}"),
        children: <Widget>[
          ListTile(
            leading: Text('Pet $_index : '),
            title: TextField(
              onChanged: (val) => _formdata['pet${keyValue - 1}'] = val,
            ),
          ),
          ListTile(
            leading: Text('Name of Pet $_index : '),
            title: TextField(
              onChanged: (val) {
                _formdata['name${keyValue - 1}'] = val;
              },
            ),
          ),
        ],
      ));

    setState(() => ++_index);
  }

  Widget _buildidentificationtype1() {
    return FormBuilder(
      autovalidate: true,
      child: FormBuilderCustomField(
          attribute: "Identification type",
          validators: [FormBuilderValidators.required()],
          formField: FormField(
            builder: (FormFieldState<dynamic> field) {
              return InputDecorator(
                decoration: InputDecoration(
                  prefixIcon: Icon(Icons.location_on),
                  labelText: 'Select Personal Identification type',
                  errorText: field.errorText,
                ),
                isEmpty: type == '',
                child: new DropdownButtonHideUnderline(
                  child: new DropdownButton(
                    value: type,
                    isDense: true,
                    onChanged: (String newValue) {
                      setState(() {
                        type = newValue;
                        field.didChange(newValue);
                      });
                    },
                    items: _type.map(
                      (String value) {
                        return new DropdownMenuItem(
                          value: value,
                          child: new Text(value),
                        );
                      },
                    ).toList(),
                  ),
                ),
              );
            },
          )),
    );
  }

  Widget _builddocumentnumber1() {
    return new TudoTextWidget(
      controller: clrbusinesslicense,
      prefixIcon: Icon(FontAwesomeIcons.idCard),
      labelText: "Business License No",
      hintText: "Business License No",
      validator: Validators().validateLicenseno,
      onSaved: (val) {
        _licenseno = val;
      },
    );
  }

  Widget _buildexpirydate1() {
    return FormField(builder: (FormFieldState state) {
      return DateTimeField(
        decoration: InputDecoration(
            labelText: expirydate1.toString(),
            prefixIcon: Icon(Icons.date_range)),
        format: format,
        onShowPicker: (context, currentValue) async {
          final DateTime picked = await showDatePicker(
              context: context,
              initialDate: expirydate1,
              firstDate: DateTime(1900),
              lastDate: DateTime.now());
          if (picked != null && picked != expirydate1)
            setState(() {
              expirydate1 = picked;
              print(expirydate1);
            });
        },
      );
    });
  }

  Widget _buildissuingauthority1() {
    return new TudoTextWidget(
      prefixIcon: Icon(FontAwesomeIcons.idCard),
      labelText: "Photo Identification issuing authority ",
      hintText: "Photo Identification issuing authority ",
      validator: (val) => Validators.validateName(val, "Issuing Authority"),
      onSaved: (val) {
        illusingauthority = val;
      },
      controller: clrissuingauthority,
    );
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: Text("BSP Unlicensed Signup"),
        leading: IconButton(
          icon: Icon(Icons.arrow_back_ios),
          onPressed: () {
            NavigationHelper.navigatetoBack(context);
          },
        ),
        actions: <Widget>[IconButton(icon: Icon(Icons.add), onPressed: _add)],
        centerTitle: true,
      ),
      body: Container(
        height: double.infinity,
        width: double.infinity,
        child: Form(
          autovalidate: true,
          key: _formKey,
          child: Stack(
            children: <Widget>[
              // Background(),
              SingleChildScrollView(
                padding: const EdgeInsets.all(30.0),
                child: new Container(
                  child: new Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      _buildidentificationtype1(),
                      _builddocumentnumber1(),
                      _buildexpirydate1(),
                      _buildissuingauthority1(),
                    ],
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

person Rutvik Gumasana    schedule 02.10.2019    source источник


Ответы (2)


Flutter — это декларативная структура пользовательского интерфейса, а не императивная. Вы не будете принудительно создавать новое поле.

Flutter (декларативный) способ сделать это - щелкнуть кнопку, чтобы изменить состояние вашего виджета и вызвать setState, когда виджет перестраивается, он примет во внимание ваше изменение состояния и создаст новый компонент. Подводя итог, вы можете сделать что-то вроде этого:

//initialize with false
isClicked = false;

_add() {
  setState(() {
   isClicked = true;
  })
}

isClicked ? _buildidentificationtype1() : Container(),
isClicked ? _builddocumentnumber1() : Container(),
isClicked ? _buildexpirydate1() : Container(),
isClicked ? _buildissuingauthority1() : Container(),

person Rodrigo Bastos    schedule 02.10.2019
comment
но он будет добавляться только один раз. Есть ли у вас какое-либо другое решение, которое будет добавлять поле каждый раз, когда я нажимаю кнопку «Добавить»? Если вы можете помочь мне, пожалуйста, помогите мне - person Rutvik Gumasana; 02.10.2019
comment
Если вы хотите добавить каждый раз, вы должны изменить немного. В этом случае вы можете создать переменную Список виджетов, и каждый раз, когда вы нажимаете кнопку, вы добавляете виджеты в конец списка и снова вызываете setState. И последнее, но не менее важное: вы используете список виджетов в своем методе сборки. - person Rodrigo Bastos; 02.10.2019
comment
Не могли бы вы помочь мне сделать это? Не могли бы вы обновить ответ, это мой запрос - person Rutvik Gumasana; 03.10.2019

person    schedule
comment
Не могли бы вы объяснить мне, что вы сделали в этом коде ?? - person Rutvik Gumasana; 02.10.2019
comment
в моем примере вы можете получить любое количество текстовых полей, используя массив динамически - person hio; 03.10.2019