Flutter导航栏不随主题变化

Question

当用户更改主题时，我试图设置导航栏的颜色更改，但不起作用。我想这是因为我在定义主题之前使用了主题？所以我把systemNavigationBarColor:Theme.of(context(.assentColor放在home((中，但仍然不好。如果我删除了代码，在一些设备的导航栏是暗的，其他的是亮的，不管我设置了什么主题。为什么请帮帮我。

void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
systemNavigationBarColor:Theme.of(context).accentColor, 
));
return StreamProvider<User>.value(
value: AuthService().user,
child: GestureDetector(
onTap: (){
FocusScope.of(context).requestFocus(FocusNode());
},
child: MaterialApp(
theme: ThemeData(
brightness: Brightness.light,
primaryColor: Colors.white,
accentColor: Colors.grey[300],
disabledColor: Colors.grey[400],
),
darkTheme: ThemeData(
brightness: Brightness.dark,
primaryColor: Colors.black,
accentColor: Colors.grey[800],
disabledColor: Colors.grey[700],
),
home: Home(),

},
),
),
);
}
}

Answer 1

我想这是因为我在定义之前使用了主题

正是这样。尝试使用AnnotatedRegion

import 'package:flutter/services.dart';
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return StreamProvider<User>.value(
value: AuthService().user,
child: GestureDetector(
onTap: (){
FocusScope.of(context).requestFocus(FocusNode());
},
child: MaterialApp(
theme: ThemeData(
brightness: Brightness.light,
primaryColor: Colors.white,
accentColor: Colors.grey[300],
disabledColor: Colors.grey[400],
),
darkTheme: ThemeData(
brightness: Brightness.dark,
primaryColor: Colors.black,
accentColor: Colors.grey[800],
disabledColor: Colors.grey[700],
),
home: Builder( //so you can use the context down the tree for Theme.of(context)
builder: (context) { 
return AnnotatedRegion<SystemUiOverlayStyle>(
value: SystemUiOverlayStyle(
statusBarColor: Theme.of(context).accentColor,
),
child: Home(),
);
}
),

},
),
),
);
}
}