I have seen numerous posts with this issue, but none of the answers worked in my case (I think I know why too). I have a landing page in my Flutter mobile app where users can sign up, log in, or ask to get an email to get their password reset. For each of these features, I have a Form widget. Each form needs a form key (a GlobalKey<FormState>). Users can switch between forms thanks to an IndexedStack. The error I receive when switching between forms is:
The following assertion was thrown while finalizing the widget tree:
Multiple widgets used the same GlobalKey.
The key [LabeledGlobalKey<FormState>#eebb6] was used by multiple widgets. The parents of those widgets were different widgets that both had the following description:
RegisterPage(dependencies: [_LocalizationsScope-[GlobalKey#f7403], _InheritedProviderScope<LandingPageModel>, _InheritedTheme])
A GlobalKey can only be specified on one widget at a time in the widget tree.
Now this question is similar but the solution doesn't work because I need the keys to be of the type GlobalKey, because they are form keys and I need to be able to call .validate(), for example. This question is very similar, but the solution doesn't work either. For one, the OP shows an error where both widgets have a different description; my error yields widgets with the same description.
I tried to create a minimal code example, but the error is not quite te same. Running this snippet yields a similar error:
Duplicate GlobalKeys detected in widget tree.
The following GlobalKeys were specified multiple times in the widget tree. This will lead to parts of the widget tree being truncated unexpectedly, because the second time a key is seen, the previous instance is moved to the new location. The keys were:
- [LabeledGlobalKey<FormState>#a86c7]
[LabeledGlobalKey<FormState>#c46a1]
[LabeledGlobalKey<FormState>#1b7fd]
This was determined by noticing that after widgets with the above global keys were moved out of their respective previous parents, those previous parents never updated during this frame, meaning that they either did not update at all or updated before the widgets were moved, in either case implying that they still think that they should have a child with those global keys.
The specific parents that did not update after having one or more children forcibly removed due to GlobalKey reparenting are:
- ColoredBox(color: MaterialColor(primary value: Color(0xffff9800)), renderObject: _RenderColoredBox#8c966 relayoutBoundary=up6 NEEDS-PAINT)
ColoredBox(color: MaterialColor(primary value: Color(0xff2196f3)), renderObject: _RenderColoredBox#73e9a relayoutBoundary=up6 NEEDS-PAINT)
ColoredBox(color: MaterialColor(primary value: Color(0xff9e9e9e)), renderObject: _RenderColoredBox#dcb58 relayoutBoundary=up6)
A GlobalKey can only be specified on one widget at a time in the widget tree.
I'm not sure why it gives a different error. The original code does some work with the provider package, and there the LandingPage is a StatelessWidget. At any rate, there should not be duplicate GlobalKeys since the pages are declared as final and each page uses its unique key only once. Any help is appreciated!
I have solved the issue myself by putting the forms in Statefulwidgets instead of trying to use some provider state management. Should've realised that a GlobalKey really does require a state!