DropdownMenu becomes unclickable with dynamically updated line charts

[t123yh]

Describe the bug When the displayed page contains a line chart that's being constantly updated (like Line Chart Sample 10 in the example app), DropdownMenu entries become unclickable.

To Reproduce See this repo: https://github.com/t123yh/fl_chart/tree/main/example (official example with a little code added to demonstrate the bug)

• Scroll to Line Chart Sample 10.
• Click the triangle to open the dropdown menu.
• Try to click one entry. It is unclickable.
• Click "Stop" button to stop the line chart from refreshing.
• Open the dropdown menu and click one item. Now it becomes clickable.

Screenshots

Versions

• which version of the Flutter are you using?

  Flutter 3.16.7 • channel stable • https://github.com/flutter/flutter.git
  Framework • revision ef1af02aea (6 days ago) • 2024-01-11 15:19:26 -0600
  Engine • revision 4a585b7929
  Tools • Dart 3.2.4 • DevTools 2.28.5

  Issue reproducible on Android and macOS

• which version of the FlChart are you using? master branch

[imaNNeo]

Because your dropdown is defined at the same level of the widget tree that we rebuild 60 times per second. The solution is that define the dropDown as a top-level widget separate it from the 60 times rebuild.

Take a look at this code: https://gist.github.com/imaNNeo/0b373eff097faf7a9a33e37ad1707fef