custom_dropdown_button2.dart 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. import 'package:fis_lib_dropdown_button/dropdown_button2.dart';
  2. import 'package:flutter/material.dart';
  3. class CustomDropdownButton2 extends StatelessWidget {
  4. final String hint;
  5. final String? value;
  6. final List<String> dropdownItems;
  7. final ValueChanged<String?>? onChanged;
  8. final DropdownButtonBuilder? selectedItemBuilder;
  9. final Alignment? hintAlignment;
  10. final Alignment? valueAlignment;
  11. final double? buttonHeight, buttonWidth;
  12. final EdgeInsetsGeometry? buttonPadding;
  13. final BoxDecoration? buttonDecoration;
  14. final int? buttonElevation;
  15. final Widget? icon;
  16. final double? iconSize;
  17. final Color? iconEnabledColor;
  18. final Color? iconDisabledColor;
  19. final double? itemHeight;
  20. final EdgeInsetsGeometry? itemPadding;
  21. final double? dropdownHeight, dropdownWidth;
  22. final EdgeInsetsGeometry? dropdownPadding;
  23. final BoxDecoration? dropdownDecoration;
  24. final int? dropdownElevation;
  25. final Radius? scrollbarRadius;
  26. final double? scrollbarThickness;
  27. final bool? scrollbarAlwaysShow;
  28. final Offset? offset;
  29. const CustomDropdownButton2({
  30. required this.hint,
  31. required this.value,
  32. required this.dropdownItems,
  33. required this.onChanged,
  34. this.selectedItemBuilder,
  35. this.hintAlignment,
  36. this.valueAlignment,
  37. this.buttonHeight,
  38. this.buttonWidth,
  39. this.buttonPadding,
  40. this.buttonDecoration,
  41. this.buttonElevation,
  42. this.icon,
  43. this.iconSize,
  44. this.iconEnabledColor,
  45. this.iconDisabledColor,
  46. this.itemHeight,
  47. this.itemPadding,
  48. this.dropdownHeight,
  49. this.dropdownWidth,
  50. this.dropdownPadding,
  51. this.dropdownDecoration,
  52. this.dropdownElevation,
  53. this.scrollbarRadius,
  54. this.scrollbarThickness,
  55. this.scrollbarAlwaysShow,
  56. this.offset,
  57. Key? key,
  58. }) : super(key: key);
  59. @override
  60. Widget build(BuildContext context) {
  61. return DropdownButtonHideUnderline(
  62. child: DropdownButton2(
  63. //To avoid long text overflowing.
  64. isExpanded: true,
  65. hint: Container(
  66. alignment: hintAlignment,
  67. child: Text(
  68. hint,
  69. overflow: TextOverflow.ellipsis,
  70. maxLines: 1,
  71. style: TextStyle(
  72. fontSize: 14,
  73. color: Theme.of(context).hintColor,
  74. ),
  75. ),
  76. ),
  77. value: value,
  78. items: dropdownItems
  79. .map((item) => DropdownMenuItem<String>(
  80. value: item,
  81. child: Container(
  82. alignment: valueAlignment,
  83. child: Text(
  84. item,
  85. overflow: TextOverflow.ellipsis,
  86. maxLines: 1,
  87. style: const TextStyle(
  88. fontSize: 14,
  89. ),
  90. ),
  91. ),
  92. ))
  93. .toList(),
  94. onChanged: onChanged,
  95. selectedItemBuilder: selectedItemBuilder,
  96. icon: icon ?? const Icon(Icons.arrow_forward_ios_outlined),
  97. iconSize: iconSize ?? 12,
  98. iconEnabledColor: iconEnabledColor,
  99. iconDisabledColor: iconDisabledColor,
  100. buttonHeight: buttonHeight ?? 40,
  101. buttonWidth: buttonWidth ?? 140,
  102. buttonPadding:
  103. buttonPadding ?? const EdgeInsets.only(left: 14, right: 14),
  104. buttonDecoration: buttonDecoration ??
  105. BoxDecoration(
  106. borderRadius: BorderRadius.circular(14),
  107. border: Border.all(
  108. color: Colors.black45,
  109. ),
  110. ),
  111. buttonElevation: buttonElevation,
  112. itemHeight: itemHeight ?? 40,
  113. itemPadding: itemPadding ?? const EdgeInsets.only(left: 14, right: 14),
  114. //Max height for the dropdown menu & becoming scrollable if there are more items. If you pass Null it will take max height possible for the items.
  115. dropdownMaxHeight: dropdownHeight ?? 200,
  116. dropdownWidth: dropdownWidth ?? 140,
  117. dropdownPadding: dropdownPadding,
  118. dropdownDecoration: dropdownDecoration ??
  119. BoxDecoration(
  120. borderRadius: BorderRadius.circular(14),
  121. ),
  122. dropdownElevation: dropdownElevation ?? 8,
  123. scrollbarRadius: scrollbarRadius ?? const Radius.circular(40),
  124. scrollbarThickness: scrollbarThickness,
  125. scrollbarAlwaysShow: scrollbarAlwaysShow,
  126. //Null or Offset(0, 0) will open just under the button. You can edit as you want.
  127. offset: offset,
  128. dropdownOverButton: false, //Default is false to show menu below button
  129. ),
  130. );
  131. }
  132. }