AhmedLSayed9
dropdown open animation is slow relative to flutter dropdown
when drop down is opened its animation is slow and jittery create 2 drop downs one with flutter and one with dropdown 2 and see the difference
@alihassan143
I can't find the difference. Can you point me to how I can reproduce it?
https://github.com/user-attachments/assets/16e5c368-bce5-4f5e-902e-d55e5e68279e
enum AppSlyes {
random,
characterDriven,
emotionBased,
eventDriven,
symbolismDriven,
mythological,
dreamBased,
dialogueCenteric,
interactive,
collaborative
}
extension DeviceWidth on BuildContext {
double get width {
return MediaQuery.sizeOf(this).width;
}
double get height {
return MediaQuery.sizeOf(this).height;
}
ThemeData get theme {
return Theme.of(this);
}
TextTheme get textTheme {
return Theme.of(this).textTheme;
}
Size get sizeOf {
return MediaQuery.sizeOf(this);
}
bool get isArbicOrUrdu {
return Directionality.of(this) == TextDirection.rtl;
}
bool get isDarkTheme => theme.brightness == Brightness.dark;
bool get isDesktop =>
Platform.isMacOS || Platform.isWindows || Platform.isLinux;
bool get keyboardOpened => MediaQuery.of(this).viewInsets.bottom != 0;
double get bottomInsets => MediaQuery.of(this).viewInsets.bottom;
}
final style = ValueNotifier<AppSlyes>(AppSlyes.random);
Container(
width: context.width,
height: context.height * 0.06,
padding: EdgeInsets.symmetric(
vertical: context.height * 0.005),
decoration: BoxDecoration(
color: Theme.of(context).cardColor,
borderRadius: BorderRadius.circular(12),
border: Border.all(
width: 1, color: Theme.of(context).dividerColor),
),
child: DropdownButtonHideUnderline(
child: DropdownButton2<AppSlyes>(
isExpanded: true,
dropdownSeparator: DropdownSeparator<AppSlyes>(
height: 1,
child: Padding(
padding: EdgeInsets.symmetric(
horizontal: context.width * 0.03),
child: Divider(
color: context.theme.dividerColor,
thickness: 1,
),
),
),
hint: Text(
genre.value.name
style: Theme.of(context)
.textTheme
.titleSmall!
.copyWith(
fontWeight: FontWeight.w500,
fontSize: 16),
),
valueListenable: genre,
items: AppSlyes.values
.map((item) => DropdownItem<AppSlyes>(
closeOnTap: true,
value: item,
child:
Text(
item.name,
style: Theme.of(context)
.textTheme
.titleSmall!
.copyWith(
fontWeight: FontWeight.w600,
fontSize: 17),
),
))
.toList(),
onChanged: (value) {
if (value == null) {
return;
}
setState(() {
style.value = value;
});
},
buttonStyleData: ButtonStyleData(
height: context.height * 0.04,
),
iconStyleData: IconStyleData(
icon: Icon(
Icons.keyboard_arrow_down,
color: context.theme.primaryColorDark,
size: 20,
),
),
dropdownStyleData: DropdownStyleData(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Theme.of(context).cardColor,
),
maxHeight: 165.0),
menuItemStyleData: MenuItemStyleData(
padding: EdgeInsets.symmetric(
horizontal: context.width * 0.03),
),
),
),
),
I can't run that. Please make a minimal sample that I can run (without external dependencies)
their is no external dependencies its pure dart enum based drop down
It's not. I don't have AppLocalizations or genre etc..
Can you check if this sample reproduces the issue for you ?
Here's a minimal sample: https://github.com/AhmedLSayed9/dropdown_button2/blob/master/packages/dropdown_button2_test/lib/src/simple_example.dart
Please check if it reproduces the issue, or else update it to reproduce it.