Dropdown Select

C2CDropdownSelect is a customizable dropdown selection widget in Flutter. It allows for selection from a list of options and is highly customizable, supporting features like enabling/disabling the dropdown, custom styles, icons, error handling, and helper text.

Installation

cpub add c2c_select

or

flutter pub add c2c_select --hosted-url=https://pub.csp.scrum-dev.com

Example Usage

C2CDropdownSelect<String>(
  items: const [
    C2CSelectItem(label: 'Option 1', value: 'option_1'),
    C2CSelectItem(label: 'Option 2', value: 'option_2')
  ],
  value: 'option_1',
  onChanged: (String? newValue) {
    // Handle selection change
  },
  label: 'Select Option',
  // Additional customizations
)

Properties

Property	Description	Type
items	A list of C2CSelectItem objects representing the selectable items.	List<C2CSelectItem<T>>
value	The initial selected value.	T?
onChanged	Callback when a selection is made.	ValueChanged<T?>?
enabled	Whether the dropdown is enabled.	bool
dropdownMaxHeight	Maximum height of the dropdown menu.	double?
enableFilter	Whether the menu list can be filtered.	bool
textStyle	Text style for the dropdown's TextField.	TextStyle?
controller	Controller for managing the dropdown state.	C2CSelectController?
dropdownBackgroundColor	Background color of the dropdown menu.	Color?
dropdownBorderRadius	Border radius for the dropdown menu.	double?
itemTextStyle	Text style for dropdown items.	TextStyle?
leftIcon	Icon displayed to the left of the dropdown.	Widget?
rightIcon	Icon displayed to the right of the dropdown.	Widget?
leftIconPadding	Padding for the left icon.	EdgeInsets?
rightIconPadding	Padding for the right icon.	EdgeInsets?
label	Label displayed above the dropdown.	dynamic
helperText	Helper text displayed below the dropdown.	dynamic
error	Error message displayed below the dropdown.	dynamic
isRequired	Whether the dropdown is required.	bool
labelStyle	Text style for the label.	TextStyle?
asteriskStyle	Text style for the asterisk denoting a required field.	TextStyle?
errorStyle	Text style for error messages.	TextStyle?
helperStyle	Text style for helper text.	TextStyle?
errorMaxLines	Maximum number of lines for error text.	int?
helperMaxLines	Maximum number of lines for helper text.	int?
scrollPadding	Padding to edges surrounding a Scrollable when the TextField scrolls into view.	EdgeInsets?
onFocus	Callback function called when the dropdown gains focus.	VoidCallback?
onBlur	Callback function called when the dropdown loses focus.	VoidCallback?
borderRadius	Border radius for the dropdown.	BorderRadius?
selectItemBuilder	Builder function for customizing dropdown items.	C2CSelectItemBuilder?
placeholder	Placeholder text displayed when no value is selected.	String?
listController	Scroll controller for the dropdown menu.	ScrollController?
checkboxColor	Color of checkboxes in the dropdown.	Color?
selectedItemBackgroundColor	Background color of the selected dropdown item.	Color?
itemBackgroundColor	Background color of dropdown items.	Color?

C2CSelectItem<T>

Property	Description	Type
label	The text label displayed for the select item.	String
labelStyle	The text style for the label.	TextStyle?
value	The value that this select item represents.	T
disabled	Indicates whether the item is disabled.	bool

SelectType

SelectType is used to define the selection type (single or multiple) in selection widgets.

• SelectType.single: For widgets that allow only single selection.
• SelectType.multiple: For widgets that allow multiple selections.

C2CSelectItemBuilder<T>

typedef C2CSelectItemBuilder<T> = Widget Function(BuildContext context, T item, bool isSelected, Function() onChanged);

• A builder function for customizing the appearance and behavior of select items.
• Parameters:
  • context: The build context.
  • item: The item data.
  • isSelected: Indicates if the item is selected.
  • onChanged: Callback function to handle changes in item selection.

C2CSelectController

C2CSelectController is a controller class used to manage the state and behavior of a dropdown widget

Key Methods

isOpen

• Returns a boolean value indicating whether the dropdown is currently open.
• Usage: controller.isOpen

open

• Opens the dropdown programmatically.
• Ensures that the _anchor is not null before performing the action.
• Usage: controller.open()

close

• Closes the dropdown programmatically.
• Ensures that the _anchor is not null before performing the action.
• Usage: controller.close()

Example Usage

final C2CSelectController controller = C2CSelectController();

// To open the dropdown
controller.open();

// To close the dropdown
controller.close();

// To check if the dropdown is open
bool isDropdownOpen = controller.isOpen;