AhmedLSayed9 / dropdown_button2

Flutter's core Dropdown Button widget with steady dropdown menu and many other features.
https://pub.dev/packages/dropdown_button2
MIT License
264 stars 122 forks source link

Use onMenuStateChange & FocusNode for TextField not working #303

Open VladislavYakonyuk opened 2 months ago

VladislavYakonyuk commented 2 months ago

I have DropdownButton2 and DropdownMenuItem with TextField. TextField have FocusNode.

I want to put requestFocus on the onMenuStateChange event so that when my window is opened, the field gets focus. But alas, this code doesn't work

My Code:

    return DropdownButtonHideUnderline(
      child: DropdownButton2<String>(
        isDense: true,
        isExpanded: true,
        customButton: Tooltip(
          message: "Filter by Balance",
          child: Container(
              color: _menuIsExpand
                  ? const Color(0xFFE0E0E0)
                  : const Color(0xFFF2F2F2),
            ),
            child: Row(
              children: [
                Icon(
                  Icons.filter_list_rounded,
                  size: 16,
                ),
              ],
            ),
          ),
        ),
        onMenuStateChange: (val) {
          setState(() {
            _menuIsExpand = val;
          });

          _minRangeValueFocus.requestFocus();
        },
        onChanged: (val) {},
        buttonStyleData: ButtonStyleData(
          height: 60,
          padding: const EdgeInsets.only(top: 4, bottom: 4, right: 8),
          decoration: BoxDecoration(
            color: const Color(0xFFF2F2F2),
            borderRadius: BorderRadius.circular(4),
          ),
        ),
        dropdownStyleData: DropdownStyleData(
          width: 250,
          maxHeight: 150,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(4),
          ),
        ),
        menuItemStyleData: const MenuItemStyleData(height: 128),
        items: [
          DropdownMenuItem(
            enabled: false,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisSize: MainAxisSize.min,
              children: [
                const Text("Filter by Balance"),
                const SizedBox(height: 8),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Expanded(
                      child: InputWidget(
                        hintText: "min",
                        textInputAction: TextInputAction.next,
                        keyboardType: TextInputType.number,
                        focusNode: _minRangeValueFocus,
                        onSubmitted: (_) => _maxRangeValueFocus.requestFocus(),
                        maxLength: 7,
                        inputFormatters: [
                          FilteringTextInputFormatter.allow(
                            RegExp(r"^(\d+)?\.?\d{0,2}"),
                          ),
                        ],
                        controller: _minRangeValueController,
                      ),
                    ),
                    const SizedBox(width: 8),
                    Expanded(
                      child: InputWidget(
                        hintText: "max",
                        textInputAction: TextInputAction.done,
                        focusNode: _maxRangeValueFocus,
                        keyboardType: TextInputType.number,
                        onSubmitted: (_) => _submit(context),
                        maxLength: 7,
                        inputFormatters: [
                          FilteringTextInputFormatter.allow(
                            RegExp(r"^(\d+)?\.?\d{0,2}"),
                          ),
                        ],
                        controller: _maxRangeValueController,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );