In my app I am trying to set up a screen flow that changes the ThemeData for a screen and all screens pushed to the stack from that screen. I have successfully changed the ThemeData using a Theme widget and that is cascading down to all other widgets in the view. When I push a new screen to the stack it is inheriting the ThemeData from the MaterialApp at the top of my application. I had thought that the Theme widget would at the ThemeData to the tree but it isn’t working that way. Does anyone know what I am doing wrong? FYI I am using GoRouter for pushing most screens to the stack if that is relevant.
When you are on Screen 1 (lest say list screen) and you push Screen 2 (lets say detail screen), then your widget tree structure is probably different than you think. Screen 2 is not child of Screen 1. It works like stack:
- MaterialApp
- Screen 1 (url i.e. ‘/list’)
- Theme // here you change theme
- Screen2 (url i.e. ‘/list/detail’)
- Screen 1 (url i.e. ‘/list’)
Therefore this way changes to Theme are not applied to other pages, no matter the go router structure.
You may try:
- either wrapping your flow with a separate Navigator which would be wrapped with new ThemeData
- create your own Route that would wrap its child with ThemeData
- build reusable widget that is your “page” that always wraps it with new ThemeData
Thanks for the explanation. I also saw the same thing in the flutter inspector.