Repository navigation
DropdownMenu does not highlight correct selected item #147516
Description
Steps to reproduce
With the following code, when item with label test is selected the item with label my test is selected instead, Although the object has different uuid. if I select bla or test 1 then it works as expected.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Custom Dropdown Menu',
home: DropdownMenuExample(),
);
}
}
class DropdownMenuExample extends StatefulWidget {
@override
_DropdownMenuExampleState createState() => _DropdownMenuExampleState();
}
class _DropdownMenuExampleState extends State<DropdownMenuExample> {
MyObject? selectedValue;
@override
Widget build(BuildContext context) {
List<MyObject> items = [
MyObject(
name: 'my test',
uuid: '3fa85f64-5617-4562-b3fc-2c963f66afa6',
),
MyObject(
name: "bla",
uuid: "4fa85f64-5717-4562-b3fc-2c963f66afa6",
),
MyObject(
name: "test",
uuid: "3fa85f64-5717-4562-b3fc-2c963f68afa6",
),
MyObject(
name: "test 2",
uuid: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
),
];
return Scaffold(
appBar: AppBar(
title: Text('Custom Dropdown Menu'),
),
body: Center(
child: DropdownMenu<MyObject>(
initialSelection: selectedValue,
onSelected: (MyObject? newValue) {
setState(() {
selectedValue = newValue;
});
},
dropdownMenuEntries: items.map<DropdownMenuEntry<MyObject>>((MyObject scope) {
return DropdownMenuEntry<MyObject>(
value: scope,
label: scope.name,
);
}).toList(),
),
),
);
}
}
class MyObject {
final String name;
final String uuid;
MyObject({
required this.name,
required this.uuid,
});
}Expected results
if I select test then test should be highlighted the next time the menu is opened.
Actual results
With the following code, when item with label test is selected the item with label my test is selected instead, Although the object has different uuid. if I select bla or test 1 then it works as expected.
Code sample
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Custom Dropdown Menu',
home: DropdownMenuExample(),
);
}
}
class DropdownMenuExample extends StatefulWidget {
@override
_DropdownMenuExampleState createState() => _DropdownMenuExampleState();
}
class _DropdownMenuExampleState extends State<DropdownMenuExample> {
MyObject? selectedValue;
@override
Widget build(BuildContext context) {
List<MyObject> items = [
MyObject(
name: 'my test',
uuid: '3fa85f64-5617-4562-b3fc-2c963f66afa6',
),
MyObject(
name: "bla",
uuid: "4fa85f64-5717-4562-b3fc-2c963f66afa6",
),
MyObject(
name: "test",
uuid: "3fa85f64-5717-4562-b3fc-2c963f68afa6",
),
MyObject(
name: "test 2",
uuid: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
),
];
return Scaffold(
appBar: AppBar(
title: Text('Custom Dropdown Menu'),
),
body: Center(
child: DropdownMenu<MyObject>(
initialSelection: selectedValue,
onSelected: (MyObject? newValue) {
setState(() {
selectedValue = newValue;
});
},
dropdownMenuEntries: items.map<DropdownMenuEntry<MyObject>>((MyObject scope) {
return DropdownMenuEntry<MyObject>(
value: scope,
label: scope.name,
);
}).toList(),
),
),
);
}
}
class MyObject {
final String name;
final String uuid;
MyObject({
required this.name,
required this.uuid,
});
}Screenshots or Video
Screenshots / Video demonstration
[Upload media here]
Logs
Logs
[Paste your logs here]Flutter Doctor output
Doctor output
[✓] Flutter (Channel beta, 3.22.0-0.1.pre, on macOS 14.4.1 23E224 darwin-arm64, locale en-GB)
[✗] Android toolchain - develop for Android devices
✗ Unable to locate Android SDK.
Install Android Studio from: https://developer.android.com/studio/index.html
On first launch it will assist you in installing the Android SDK components.
(or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).
If the Android SDK has been installed to a custom location, please use
`flutter config --android-sdk` to update to that location.
[!] Xcode - develop for iOS and macOS (Xcode 15.3)
✗ Unable to get list of installed Simulator runtimes.
[✓] Chrome - develop for the web
[!] Android Studio (not installed)
[✓] VS Code (version 1.87.2)```
</details>
Activity
diegonc commentedon Apr 29, 2024
Maybe related to #147253?
darshankawar commentedon Apr 30, 2024
@albe-jj
Can you try making use of
keyto see if it helps in your case or not ?Also check #103266 for further reference.
albe-jj commentedon Apr 30, 2024
DorpdownMenuEntryhas no property key https://api.flutter.dev/flutter/material/DropdownMenuEntry-class.html (key is forDropdownMenuItemused in dropdown button)Note that with
DropdownButtonthe selection is correct, it's when usingDropdownMenuthat selection goes wrongalbe-jj commentedon Apr 30, 2024
indeed seems related
darshankawar commentedon May 2, 2024
Thanks for the update. I was able to replicate the reported behavior.
The reported behavior occurs with
testandmy testitems while selecting with respect to selection labels. The same doesn't occur while selectingblaandtest 1.stable, master flutter doctor -v
QuncCccccc commentedon May 8, 2024
Thanks for filing this issue! The default searching algorithm is to find the first matching item which contains the queried text. We can use
searchCallbackto find the result exactly matching the query:) https://api.flutter.dev/flutter/material/DropdownMenu/searchCallback.htmlFix `DropdownMenu` keyboard navigation (#147294)
github-actions commentedon May 27, 2024
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.Fix `DropdownMenu` keyboard navigation (#147294)