srtraj / dropdown_textfield

custom dropdown
MIT License
8 stars 48 forks source link

how to set position of the list to the bottom of the text field inside Column in TabBarView? #35

Closed kezia2909 closed 1 year ago

kezia2909 commented 1 year ago

image image

this is the code i use for the DropDownTextField, but it show the list from the top of the device even though i already use SafeArea for the page. i also try to set the 'listSpace' but i don't see any differences

DropDownTextField( clearOption: true, controller: _itemController, textFieldFocusNode: textFieldFocusNode, searchFocusNode: searchFocusNode, searchAutofocus: true, listSpace: 25.0, dropDownItemCount: 8, searchShowCursor: true, enableSearch: true, dropDownList: const [ DropDownValueModel(name: 'name1', value: "value1"), DropDownValueModel( name: 'name2', value: "value2", toolTipMsg: "DropDownButton is a widget that we can use to select one unique value from a set of values"), DropDownValueModel(name: 'name3', value: "value3"), DropDownValueModel( name: 'name4', value: "value4", toolTipMsg: "DropDownButton is a widget that we can use to select one unique value from a set of values"), DropDownValueModel(name: 'name5', value: "value5"), DropDownValueModel(name: 'name6', value: "value6"), DropDownValueModel(name: 'name7', value: "value7"), DropDownValueModel(name: 'name8', value: "value8"), ], onChanged: (val) {}, ),

what i want is the list show exactly from the bottom of the textfield, not in from the top of device

ChauCM commented 2 months ago

how did you resolve it?

kezia2909 commented 2 months ago

how did you resolve it?

i use dropdown search

DropdownSearch<String>(
                items: listItem,
                onChanged: (value) {
                  setState(() {
                    selectedItem = value;
                  });
                },
                selectedItem: selectedItem,
                popupProps: const PopupProps.menu(
                    showSelectedItems: true, showSearchBox: true),
                dropdownDecoratorProps: const DropDownDecoratorProps(
                  dropdownSearchDecoration: InputDecoration(
                    labelText: "Select Item",
                    contentPadding:
                        EdgeInsets.symmetric(vertical: 0, horizontal: 10),
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(
                        Radius.circular(8),
                      ),
                      borderSide: BorderSide(
                        color: Colors.black,
                        width: 1.0,
                      ),
                    ),
                  ),
                ),
              ),

The result will look like this image

You can follow this for more detail https://pub.dev/packages/dropdown_search