Ad

A Value Type Of 'List Can't Be Assigned To A Variable Of Type 'List

- 1 answer

So, what I'm trying to do is use multi_select_dropdown to allow the users of a dating app to select multiple things such as genders and orientations, but I keep getting the variable error in the subject. Here is where I'm declaring the lists:

''' static List<LookingGender> _lookingGender = [
    LookingGender(id: 1, name: 'Male'),
    LookingGender(id: 2, name: 'Female'),
LookingGender(id: 3, name: 'TransMale'),
LookingGender(id: 4, name: 'TransFemale'),
LookingGender(id: 5, name: 'Non-Binary'),
LookingGender(id: 6, name: 'Agender'),
LookingGender(id: 7, name: 'Androgynous'),
LookingGender(id: 8, name: 'Genderfluid'),
LookingGender(id: 9, name: 'Genderqueer'),
LookingGender(id: 10, name: 'Intersex'),
LookingGender(id: 11, name: 'Two Spirit'),
];
final _selectedLookingGender = _lookingGender
  .map((lookingGender) =>
      MultiSelectItem<LookingGender>(lookingGender, lookingGender.name))
  .toList();
List<LookingGender> _selectedLookingGender2 = [];
List<LookingGender> _selectedLookingGender3 = [];
List<LookingGender> _selectedLookingGender5 = [];
final _multiSelectKey = GlobalKey<FormFieldState>();

static List<LookingOrientation> _lookingOrientation = [
  LookingOrientation(id: 1, name: 'Heterosexual'),
  LookingOrientation(id: 2, name: 'Homosexual'),
  LookingOrientation(id: 3, name: 'Lesbian'),
  LookingOrientation(id: 4, name: 'Gay'),
  LookingOrientation(id: 5, name: 'Demisexual'),
  LookingOrientation(id: 6, name: 'Pansexual'),
  LookingOrientation(id: 7, name: 'Asexual'),
  LookingOrientation(id: 8, name: 'Bisexual'),
  LookingOrientation(id: 9, name: 'Bicurious'),
  ];
final _selectedLookingOrientation = _lookingOrientation
  .map((lookingOrientation) => MultiSelectItem<LookingOrientation>(
      lookingOrientation, lookingOrientation.name))
  .toList();
List<LookingOrientation> _selectedLookingOrientation2 = [];
List<LookingOrientation> _selectedLookingOrientation3 = [];
List<LookingOrientation> _selectedLookingOrientation5 = [];'''

And here is where things get wonky. The error appears to be on the 'values' variable.

''' // Looking for Gender field
                Container(
                  decoration: BoxDecoration(
                    color: Theme.of(context).primaryColor.withOpacity(0.4),
                    border: Border.all(
                      color: Theme.of(context).primaryColor,
                      width: 2,
                    ),
                  ),
                  child: Column(
                    children: <Widget>[
                      MultiSelectBottomSheetField(
                        initialChildSize: 0.4,
                        listType: MultiSelectListType.CHIP,
                        searchable: true,
                        buttonText: Text('Looking for Gender'),
                        title: Text('Genders'),
                        items: _selectedLookingGender,
                        onConfirm: (values) {
                          _selectedLookingGender2 = values;
                        },
                        chipDisplay: MultiSelectChipDisplay(
                          onTap: (value) {
                            setState(() {
                              _selectedLookingGender2.remove(value);
                            });
                          },
                        ),
                      ),
                      _selectedLookingGender2 == null ||
                              _selectedLookingGender2.isEmpty
                          ? Container(
                              padding: EdgeInsets.all(10),
                              alignment: Alignment.centerLeft,
                              child: const Text(
                                "None Selected",
                                style: TextStyle(color: Colors.black54),
                              ))
                          : Container(),
                    ],
                  ),
                ),

                SizedBox(height: 20),

                MultiSelectChipField<LookingGender>(
                  items: _selectedLookingGender,
                  initialValue: [_lookingGender[1]],
                  title: const Text('Genders'),
                  headerColor: Colors.blue.withOpacity(0.5),
                  decoration: BoxDecoration(
                    border:
                        Border.all(color: (Colors.blue[700]!), width: 1.8),
                  ),
                  selectedChipColor: Colors.blue.withOpacity(0.5),
                  selectedTextStyle: TextStyle(color: Colors.blue[800]),
                  onTap: (values) {},
                ),
                const SizedBox(height: 20),

                // Looking for Orientation field
                Container(
                  decoration: BoxDecoration(
                    color: Theme.of(context).primaryColor.withOpacity(0.4),
                    border: Border.all(
                      color: Theme.of(context).primaryColor,
                      width: 2,
                    ),
                  ),
                  child: Column(
                    children: <Widget>[
                      MultiSelectBottomSheetField(
                        initialChildSize: 0.4,
                        listType: MultiSelectListType.CHIP,
                        searchable: true,
                        buttonText: Text('Looking for Gender'),
                        title: Text('Genders'),
                        items: _selectedLookingGender,
                        onConfirm: (values) {
                          _selectedLookingGender2 = values;
                        },
                        chipDisplay: MultiSelectChipDisplay(
                          onTap: (value) {
                            setState(() {
                              _selectedLookingGender2.remove(value);
                            });
                          },
                        ),
                      ),
                      _selectedLookingGender2 == null ||
                              _selectedLookingGender2.isEmpty
                          ? Container(
                              padding: EdgeInsets.all(10),
                              alignment: Alignment.centerLeft,
                              child: const Text(
                                "None Selected",
                                style: TextStyle(color: Colors.black54),
                              ))
                          : Container(),
                    ],
                  ),
                ),
                MultiSelectChipField(
                  items: _selectedLookingOrientation,
                  initialValue: [_lookingOrientation[1]],
                  title: const Text('Orientation'),
                  headerColor: Colors.blue.withOpacity(0.5),
                  decoration: BoxDecoration(
                    border:
                        Border.all(color: (Colors.blue[700]!), width: 1.8),
                  ),
                  selectedChipColor: Colors.blue.withOpacity(0.5),
                  selectedTextStyle: TextStyle(color: Colors.blue[800]),
                  onTap: (values) {},
                ),
                const SizedBox(height: 20),'''

I am a newby at this, so it's been a somewhat painful journey.

Ad

Answer

You can try this:

MultiSelectBottomSheetField(
                        initialChildSize: 0.4,
                        listType: MultiSelectListType.CHIP,
                        searchable: true,
                        buttonText: Text('Looking for Gender'),
                        title: Text('Genders'),
                        items: _selectedLookingGender,
                        onConfirm: (values) {
                          List<LookingGender> tempSelectedLookingGender = [];

                          var newValues = values as List<MultiSelectItem<LookingGender>>;
                          newValues.forEach((element) {
                            tempSelectedLookingGender.add(element.value);
                          });

                          _selectedLookingGender2 = tempSelectedLookingGender;
                        },
                        chipDisplay: MultiSelectChipDisplay(
                          onTap: (value) {
                            setState(() {
                              _selectedLookingGender2.remove(value);
                            });
                          },
                        ),
                      ),
Ad
source: stackoverflow.com
Ad