Hello CHB61

Thanks for this great flutter lib.

Seems the initialValue property is not working correctly. Based on your example I added all animals as an initial value:

MultiSelectBottomSheetField( initialValue: _animals, ..... ),

As a result the selected animals are not shown inside the form. But all animals are pre-selected on the bottom selection area (see screenshot).

Hi,

Currently it is possible to define one color for the chips. Would be great if the color can be defined for each chip (maybe based on the value of the item. The color should apply in the MultiSelectChipDisplay and the select dialog. A function could be provided that chooses the color based on the item's value. The current chipColor is a fallback when the function is not defined or does not return with a result.

Regards, Florian

Greetings. After upgrading to the latest package, I am having this warning /C:/flutter/.pub-cache/hosted/pub.dartlang.org/multi_select_flutter-4.1.2/lib/chip_field/multi_select_chip_field.dart:273:22: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.

• 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/C:/flutter/packages/flutter/lib/src/widgets/binding.dart'). WidgetsBinding.instance!.addPostFrameCallback((_) => _scrollToPosition());

Regards

Hello!

I think your library is pretty cool. However when trying it out i got following error:

The following _TypeError was thrown building MultiSelectDialogField<String>(dirty, dependencies: [UnmanagedRestorationScope, _FormScope], state: FormFieldState<List<String>>#32167):
type '(List<String>) => void' is not a subtype of type '((List<String?>) => void)?'

With a minimal example of in a stateful widget

List<String> _indexCardIds = [];
...
MultiSelectDialogField<String>(
                  items: [MultiSelectItem<String>('hi', 'hi')],
                  onConfirm: (values) {
                    setState(() {
                      _indexCardIds = values;
                    });
                  },
                ),

Any clue whats happening here?

MultiSelectDialogField, some initial values are provided. In the MultiSelectChipDisplay's onTap method, the removal is wrapped with setstate (this does slow down the UI refreshment).

Upon clicking on initial items, they are not removed, but the validator complains 'no items selected'.

But, if no initial values provided, it works perfectly.

After upgrading to latest flutter version (2.11.0-0.0.pre.637) I get this warning?

/AppData/Local/Pub/Cache/hosted/pub.dartlang.org/multi_select_flutter-4.0.0/lib/chip_field/multi_select_chip_field.dart:273:22: Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null.
 - 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('/E:/mySoftware/flutter/packages/flutter/lib/src/widgets/binding.dart').
      WidgetsBinding.instance!.addPostFrameCallback((_) => _scrollToPosition());

Hi,

I really like the widget although there is a small thing which bothers me:

Is there any reason why dialog height can but width cannot be managed?

Is there any way to set dialog width? I use it in a web app and the dialog takes almost 80% of the screen width which is a little bit annoying.

Thank you!

Issue

While testing MultiSelectChipField I ran across the issue where I am unable to select a value because of an inner function receiving a different value than the expected one....

Console Log

======== Exception caught by gesture ===============================================================
The following TypeErrorImpl was thrown while handling a gesture:
Expected a value of type 'List<Animal>?', but got one of type 'List<Animal?>'

When the exception was thrown, this was the stack: 
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 236:49      throw_
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 84:3        castError
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/operations.dart 442:10  cast
dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/types.dart 417:9        as
packages/flutter/src/widgets/form.dart 474:21                                     didChange
...
Handler: "onTap"
Recognizer: TapGestureRecognizer#9a7e7
  debugOwner: GestureDetector
  state: ready
  won arena
  finalPosition: Offset(753.9, 456.0)
  finalLocalPosition: Offset(52.6, 15.0)
  button: 1
  sent tap down
====================================================================================================

Code I was using when this happened

class Animal {
  final int id;
  final String name;

  Animal({
    required this.id,
    required this.name,
  });
}

class MultiSelectField extends StatefulWidget {
  final String label;
  const MultiSelectField(this.label, {Key? key}) : super(key: key);

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

class _MultiSelectFieldState extends State<MultiSelectField> {
  @override
  Widget build(BuildContext context) {
    List<Animal> _animals = [
      Animal(id: 1, name: "Lion"),
      Animal(id: 2, name: "Flamingo"),
      Animal(id: 3, name: "Hippo"),
      Animal(id: 4, name: "Horse"),
      Animal(id: 5, name: "Tiger"),
      Animal(id: 6, name: "Penguin"),
      Animal(id: 7, name: "Spider"),
      Animal(id: 8, name: "Snake"),
      Animal(id: 9, name: "Bear"),
      Animal(id: 10, name: "Beaver"),
      Animal(id: 11, name: "Cat"),
      Animal(id: 12, name: "Fish"),
      Animal(id: 13, name: "Rabbit"),
      Animal(id: 14, name: "Mouse"),
      Animal(id: 15, name: "Dog"),
      Animal(id: 16, name: "Zebra"),
      Animal(id: 17, name: "Cow"),
      Animal(id: 18, name: "Frog"),
      Animal(id: 19, name: "Blue Jay"),
      Animal(id: 20, name: "Moose"),
      Animal(id: 21, name: "Gecko"),
      Animal(id: 22, name: "Kangaroo"),
      Animal(id: 23, name: "Shark"),
      Animal(id: 24, name: "Crocodile"),
      Animal(id: 25, name: "Owl"),
      Animal(id: 26, name: "Dragonfly"),
      Animal(id: 27, name: "Dolphin"),
    ];
    final _items = _animals
        .map((animal) => MultiSelectItem<Animal>(animal, animal.name))
        .toList();

    var _selectedAnimals4 = [];

    return Padding(
      padding: const EdgeInsets.only(bottom: padding8),
      child: MultiSelectChipField(
        items: _items,
        initialValue: [_animals[4], _animals[7], _animals[9]],
        title: Text("Animals"),
        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) {
          _selectedAnimals4 = values;
        },
      ),
    );
  }
}

Additional Info

• Mac mini M1 2020
• Android Studio 4.2.2
  • Developing a web app
• multi_select_flutter version 4.0.0
• Google Chrome 92.0.4515.131

In my code I have dropdownButtonFormField and MultiSelectDialogField

1 If I press submit and validate , it will throw filed required error which is fine 2 select value in dropdownButtonFormField 3. While selecting value from MultiSelectDialogField it throws[setState() called after dispose():]

Stack over flow link : https://stackoverflow.com/questions/74248509/flutter-multi-select-throws-setstate-called-after-dispose

So what im trying to do is filter lists of topics based on the the value of a selected subject through a map: Map<String, List<Topic?>> subjectTopics = { "": [Topic(id: 1, name: "Choose a subject")], "Chemistry": [ Topic(id: 1, name: "Moles"), ], "Maths": [ Topic(id: 1, name: "Series"), Topic(id: 2, name: "Polynomials"), ] };

List<Topic?> topics = subjectTopics[selectedSubject];

I update the value of the selected subject through setstate and then re-assign topics with the corresponding values from the map into a list. The widget im trying to use is MultiSelectChipField<Topic?> which upon the initialised state displays the correct values however if I update the selected subject through setState the UI does not get updated. The exception i get is "Looking up a deactivated widget's ancestor is unsafe", I have tried adding my map to didChangeDependancy as well however it did not work. Is there any way i can update the MultiSelectChipField UI via changing the items: ? Any help would me much appreciated.

When using initialValue for MultiSelectBottomSheetField, tapping on initial selected badges doesn't work. For example: `
List<Object?> _selectedAnimals = [animal[2], animal[1]];

                     initialValue = _selectedAnimals;

                     onTap: (value) {
                      setState(() {
                          _selectedAnimals.remove(value);
                      });

`

The following _TypeError was thrown building MultiSelectChipField-[LabeledGlobalKey<FormFieldState>#c739f](dirty, dependencies: [UnmanagedRestorationScope], state: FormFieldState<List>#2cdc6): type '(MultiSelectItem, FormFieldState<List>) => Widget' is not a subtype of type '((MultiSelectItem<FeaturesTransportUnitModel?>, FormFieldState<List<FeaturesTransportUnitModel?>>) => Widget)?'

The relevant error-causing widget was MultiSelectChipField-[LabeledGlobalKey<FormFieldState>#c739f]

With underlying errors, this should be depreciated in favour of material chips, added as of a few weeks ago in flutter 3.3 afaik

https://api.flutter.dev/flutter/material/Chip-class.html