flutter中DropDownSearch去除边框的方法

Question

I am using drop down search to fetch and display the list of items from firebase but I am getting a form field box by default with this widget. I wan't to remove this as it is not matching with my UI can anyone help me in this.

Widget I used is https://pub.dev/packages/dropdown_search

I am talking about the box that appears in this.

If you suggest me to use another widget then please also tell how to enable search oprtion in the same

Answer 1

If you want to remove border around dropdown element, set dropdownSearchDecoration to InputDecoration(border: InputBorder.none) :

              DropdownSearch<String>(
                dropdownSearchDecoration: InputDecoration(border: InputBorder.none),
                // ...
              )

Answer 2

dropdownDecoratorProps: DropDownDecoratorProps(
                          dropdownSearchDecoration: InputDecoration(border: InputBorder.none),
                          
                          ),

Answer 3

The DropdownSearch widget border have its default input border style. To remove, we need to overwrite it with our own inputBorder by setting the border to InputBorder.none .

Code

DropdownSearch<String>(
  enabled: true,
  items: yourList,
  dropdownDecoratorProps: const DropDownDecoratorProps(
      dropdownSearchDecoration: InputDecoration(border:InputBorder.none),
              ),
  onChanged: (myVal) {},
  selectedItem: yourOwnSetValue
)