mirai_dropdown_menu

Description:

mirai dropdown menu

MiraiDevs [email protected] #
Description #
MiraiDevs developed the Mirai Dropdown Menu Package.
Features #

You can set a static list of objects or a list you have downloaded from an API.
Search for items...

Getting started #
Take a first look: #


Installation #

Add mirai_dropdown_menu as a dependency in your pubspec.yaml file.

dependencies:
mirai_dropdown_menu: <latest_version>
copied to clipboard

Import the mirai_dropdown_menu package.

import 'package:mirai_dropdown_menu/mirai_dropdown_menu.dart';
copied to clipboard
Usage #
Create mirai_dropdown_widget.dart:
class MiraiDropdownWidget<String> extends StatelessWidget {
const MiraiDropdownWidget({
Key? key,
required this.valueNotifier,
required this.itemWidgetBuilder,
required this.children,
required this.onChanged,
this.underline = false,
this.showSeparator = true,
this.exit = MiraiExit.fromAll,
this.chevronDownColor,
this.showMode = MiraiShowMode.bottom,
this.maxHeight,
this.showSearchTextField = false,
this.showOtherAndItsTextField = false,
this.other,
}) : super(key: key);

final ValueNotifier<String> valueNotifier;
final MiraiDropdownBuilder<String> itemWidgetBuilder;
final List<String> children;
final ValueChanged<String> onChanged;
final bool underline;
final bool showSeparator;
final MiraiExit exit;
final Color? chevronDownColor;
final MiraiShowMode showMode;
final double? maxHeight;
final bool showSearchTextField;
final bool showOtherAndItsTextField;
final Widget? other;

@override
Widget build(BuildContext context) {
return MiraiDropDownMenu<String>(
key: UniqueKey(),
enable: true,
space: 4,
showMode: showMode,
exit: exit,
showSeparator: showSeparator,
children: children,
itemWidgetBuilder: itemWidgetBuilder,
onChanged: onChanged,
maxHeight: maxHeight,
showOtherAndItsTextField: showOtherAndItsTextField,
showSearchTextField: showSearchTextField,
other: other,
child: Container(
key: GlobalKey(),
padding: const EdgeInsets.symmetric(
horizontal: 14,
),
decoration: BoxDecoration(
borderRadius: underline ? null : BorderRadius.circular(5.0),
border: underline
? const Border(
bottom: BorderSide(
width: 1.0,
color: Colors.blueGrey,
),
)
: Border.all(
color: Colors.blueGrey,
width: 1.0,
),
),
height: 40,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Flexible(
child: ValueListenableBuilder<String>(
valueListenable: valueNotifier,
builder: (_, String chosenTitle, __) {
return AnimatedSwitcher(
duration: const Duration(milliseconds: 200),
child: Text(
'$chosenTitle',
key: ValueKey<String>(chosenTitle),
style: const TextStyle(
fontWeight: FontWeight.w600,
),
overflow: TextOverflow.ellipsis,
),
);
},
),
),
const SizedBox(width: 16),
FaIcon(
FontAwesomeIcons.chevronDown,
color: chevronDownColor ?? AppTheme.keyAppColor,
size: 12,
),
],
),
),
);
}
}
copied to clipboard
Create mirai_dropdown_item_widget.dart
class MiraiDropDownItemWidget extends StatelessWidget {
const MiraiDropDownItemWidget({
Key? key,
required this.item,
required this.isItemSelected,
}) : super(key: key);

final String item;
final bool isItemSelected;

@override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.symmetric(
vertical: 10.0,
horizontal: 16.0,
),
child: Text(
item,
style: const TextStyle(
color: isItemSelected ? Colors.white : Colors.black,
),
),
);
}
}
copied to clipboard
Then you can use MiraiDropdownWidget like this:
MiraiDropdownWidget<String>(
valueNotifier: valueNotifierFirst,
itemWidgetBuilder: (int index, String? item, {
bool isItemSelected = false,
}) {
return MiraiDropDownItemWidget(item: item, isItemSelected: isItemSelected);
},
children: listOfItem,
onChanged: (String value) {
valueNotifierFirst.value = value;
},
),
copied to clipboard
To Show Search Text Field:
MiraiDropdownWidget<String>(
valueNotifier: valueNotifierFirst,
showSearchTextField: true,
itemWidgetBuilder: (int index, String? item, {
bool isItemSelected = false,
}) {
return MiraiDropDownItemWidget(item: item);
},
children: listOfItem,
onChanged: (String value) {
valueNotifierFirst.value = value;
},
),
copied to clipboard
Please check the example for more information #
Support #
If the MiraiDropDown package matches your needs, please do not hesitate to support the package, I would be very grateful if you buy me a cup of coffee.

List Of Objects:




General search for list of objects:
Add toString() method to your model.
For Example:
@override
String toString() {
return 'ProjectModel{number: $number, job: $job, name: $name, title: $title, date: $date, client: $client, progress: $progress, color: $color}';
}
copied to clipboard





List Of Texts / Strings:





Search for List Of Texts / Strings: