0

I have the following custom dropdown widget that I have created.

class CustomDropdown extends StatefulWidget {
  final Color? textColor;
  final Color? backgroundColor;
  final Color? iconColor;
  final bool? boldText;
  final Object? initialValue;
  final List<DropdownMenuItem<Object?>> itemList;
  final Function(Object?) onItemSelect;

  const CustomDropdown({
    Key? key,
    this.textColor,
    this.backgroundColor,
    this.boldText,
    this.iconColor,
    required this.initialValue,
    required this.itemList,
    required this.onItemSelect,
  }) : super(key: key);

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

class _CustomDropdownState extends State<CustomDropdown> {
  late Object? _dropdownValue;
  late bool _boldText;

  @override
  void initState() {
    super.initState();
    _dropdownValue = widget.initialValue;
    _boldText = widget.boldText ?? false;
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 20,
      child: DropdownButtonHideUnderline(
        child: DropdownButton<Object?>(
          value: _dropdownValue,
          icon: Icon(
            Icons.expand_more_outlined,
            color: widget.iconColor ?? (widget.textColor ?? Colors.black),
          ),
          dropdownColor: widget.backgroundColor ?? Colors.white,
          style: TextStyle(
            color: widget.textColor ?? Colors.black,
            fontWeight: _boldText ? FontWeight.bold : FontWeight.normal,
          ),
          items: widget.itemList,
          onChanged: (value) {
            setState(() => _dropdownValue = value);
            widget.onItemSelect(value);
          },
        ),
      ),
    );
  }
}

Then I Instantiate the above widget I have created in a separate dart file as shown below,

class CurrencyDropdown extends StatelessWidget {
  const CurrencyDropdown({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Center(
      child: CustomDropdown(
        initialValue: Currency(id: 1, displayText: 'USD'),     <------------ This line throws an error
        boldText: true,
        iconColor: ColorData.disabledTextColor,
        itemList: [
          DropdownMenuItem(
            child: Text('USD'),
            value: Currency(id: 1, displayText: 'USD'),
          ),
          DropdownMenuItem(
            child: Text('LKR'),
            value: Currency(id: 2, displayText: 'LKR'),
          ),
        ],
        onItemSelect: (_) {},
      ),
    );
  }
}

In the above code, if I replace the value I have pointed with an arrow with null everything works fine. However, if I provide the value shown in the above code snippet, it throws an error.

What the error text says is,

There should be exactly one item with [DropdownButton]'s value: { id: 1, displayText: USD }. Either zero or 2 or more [DropdownMenuItem]s were detected with the same value 'package:flutter/src/material/dropdown.dart'

Furthermore it shows the following code snippet, Failed assertion: line 915 pos 15:

'items == null || items.isEmpty || value == null ||
              items.where((DropdownMenuItem<T> item) {
                return item.value == value;
              }).length == 1'

I also came across the below stack overflow posts but could not find a solution,

Can someone please help me? I would really appreciate it!

1 Answer 1

1

Your initialValue didn't match any value in itemList, try code below:

class CurrencyDropdown extends StatelessWidget {
  CurrencyDropdown({Key? key}) : super(key: key);

  List<Currency> list = [
    Currency(id: 1, displayText: 'USD'),
    Currency(id: 2, displayText: 'LKR'),
  ];

  @override
  Widget build(BuildContext context) {
    return Center(
      child: CustomDropdown(
        initialValue: list[0],
        boldText: true,
        iconColor: Colors.grey,
        itemList: list
            .map(
              (e) => DropdownMenuItem(
                child: Text(e.displayText),
                value: e,
              ),
            )
            .toList(),
        onItemSelect: (_) {},
      ),
    );
  }
}
2
  • Hello I tried this.... It still gives me the same error.... Did a completely new build and still it gives the same error....
    – CodeR_Ax20
    Dec 13, 2021 at 7:46
  • I made a mistake, please check my edited answer. I ran the code, and it worked by the way.
    – 聂超群
    Dec 13, 2021 at 8:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.