0
votes

Changer le widget sur l'événement déroulant Onchange

J'ai un menu déroulant avec plusieurs options. Pour des raisons de simplicité, disons qu'ils sont: "A", "B" et "C".

Ceci est l'extrait de mon code: P>

children: <Widget>[
                      FormBuilder(
                        key: _fbKey,
                        autovalidate: true,
                        child: Column(
                          children: <Widget>[
                            FormBuilderDropdown(
                              attribute: "value",
                              decoration: InputDecoration(
                              labelText: "Choose something?"),
                              hint: Text('Select Option'),
                              validators: [FormBuilderValidators.required()],
                              items: user.option.map((v) {
                                return DropdownMenuItem(
                                    value: v,
                                    child: ListTile(
                                      leading: Image.asset(
                                        'assets/img/image.png',
                                        width: 50,
                                        height: 50,
                                      ),
                                      title: Text("${v.option}"),
                                    ));

                              }).toList(),
                            ),
                          ],
                        ),
                       // if v.option == "A" is selected here build Widget A()
                       // if v.option == "B" is selected here build Widget B()
                       // if v.option == "C" is selected here build Widget C()
                      ),


0 commentaires

3 Réponses :


2
votes

Utilisez un widget étatique . Vous pouvez avoir un champ qui dit Wich Widget à afficher et d'appeler l'état défini à chaque fois qu'une option différente est sélectionnée. Les trois widgets pourraient être ajoutés à la liste principale code> en utilisant Collection si comme suit:

children: <Widget>[
                      FormBuilder(
                        key: _fbKey,
                        autovalidate: true,
                        child: Column(
                          children: <Widget>[
                            FormBuilderDropdown(
                              attribute: "value",
                              decoration: InputDecoration(
                              labelText: "Choose something?"),
                              hint: Text('Select Option'),
                              validators: [FormBuilderValidators.required()],
                              items: user.option.map((v) {
                                return DropdownMenuItem(
                                    value: v,
                                    child: ListTile(
                                      leading: Image.asset(
                                        'assets/img/image.png',
                                        width: 50,
                                        height: 50,
                                      ),
                                      title: Text("${v.option}"),
                                    ));

                              }).toList(),
                            ),
                          ],
                        ),
                        ),
                       if (v.option == "A") A(),
                       if (v.option == "B") B(),
                       if (v.option == "C") C(),
  ]


0 commentaires

1
votes

Vous pouvez créer un widget qui accepte l'option de son constructeur et l'appelez sous la liste déroulante Builder

Exemple: xxx

maintenant dans votre code ci-dessus < / p> xxx

note : Vous devez créer le widget parent (qui a la colonne ou le widget d'état de la colonne ou de l'enfant) pour que le code fonctionne correctement

EDIT : J'ai ajouté la variable _CurrentOption qui indiquait l'option sélectionnée actuelle et la collez-la au widget widget . Vous devez implémenter la fonction onchanged dans le formulaire Formilolerdropdown pour mettre à jour l'option sélectionnée, comme celle-ci xxx


1 commentaires

Mais ici v.Option est hors de portée. Je veux dire dans le constructeur de rendu.



6
votes

Très simple, je vois qu'il est de créer une fonction qui rend vos widgets, appelons-le _renderwidget () code>, à l'intérieur de cette fonction, vous pouvez avoir quelque chose comme suit:

Container(
  child: _renderWidget()
)


0 commentaires