Skip to main content
The Stac DropdownMenu allows you to build a Flutter DropdownMenu widget using JSON. To know more about the DropdownMenu widget in Flutter, refer to the official documentation.

​
Properties

PropertyTypeDescription
dropdownMenuEntriesList<StacDropdownMenuEntries>The entries to display in the dropdown menu.
initialSelectiondynamicThe initial selection value.
enabledboolWhether the dropdown menu is enabled. Defaults to true.
labelMap<String, dynamic>?The label to display for the dropdown menu.
leadingIconMap<String, dynamic>?The icon to display at the start of the dropdown menu.
trailingIconMap<String, dynamic>?The icon to display at the end of the dropdown menu.
hintTextString?The hint text to display when no selection is made.
errorTextString?The error text to display when there is an error.
widthdouble?The width of the dropdown menu.
menuHeightdouble?The height of the dropdown menu.
inputDecorationThemeStacInputDecorationTheme?The theme to use for the input decoration.
textStyleStacTextStyle?The text style to use for the dropdown menu.
enableFilterboolWhether to enable filtering. Defaults to true.
enableSearchboolWhether to enable search. Defaults to true.
requestFocusOnTapboolWhether to request focus on tap. Defaults to true.
The Stac DropdownMenuEntry allows you to build a Flutter DropdownMenuEntry widget using JSON. To know more about the DropdownMenuEntry widget in Flutter, refer to the official documentation.

​
Properties

PropertyTypeDescription
valuedynamicThe value associated with this entry.
labelStringThe label to display for this entry.
enabledboolWhether this entry is enabled. Defaults to true.
leadingIconMap<String, dynamic>?The icon to display at the start of this entry.
trailingIconMap<String, dynamic>?The icon to display at the end of this entry.
styleStacButtonStyle?The style to use for this entry.

​
Example JSON

{
  "type": "dropdownMenu",
  "label": {
    "type": "text",
    "data": "Select an option"
  },
  "hintText": "Please select",
  "width": 200,
  "dropdownMenuEntries": [
    {
      "value": "option1",
      "label": "Option 1",
      "leadingIcon": {
        "type": "icon",
        "iconData": "home"
      }
    },
    {
      "value": "option2",
      "label": "Option 2",
      "leadingIcon": {
        "type": "icon",
        "iconData": "settings"
      }
    },
    {
      "value": "option3",
      "label": "Option 3",
      "leadingIcon": {
        "type": "icon",
        "iconData": "favorite"
      }
    }
  ]
}