Flutter更改状态栏颜色
2019-04-17 本文已影响9人
徐爱卿
在Flutter中,例如iOS的状态栏中的时间、网络信号等字体的颜色修改有以下两个方式:
在 system_chrome.dart
文件中有两段代码,用来更改不同的状态栏字体颜色。
介绍
- 字体颜色白色
/// System overlays should be drawn with a light color. Intended for
/// applications with a dark background.
static const SystemUiOverlayStyle light = SystemUiOverlayStyle(
systemNavigationBarColor: Color(0xFF000000),
systemNavigationBarDividerColor: null,
statusBarColor: null,
systemNavigationBarIconBrightness: Brightness.light,
statusBarIconBrightness: Brightness.light,
statusBarBrightness: Brightness.dark,
);
- 字体颜色黑色
/// System overlays should be drawn with a dark color. Intended for
/// applications with a light background.
static const SystemUiOverlayStyle dark = SystemUiOverlayStyle(
systemNavigationBarColor: Color(0xFF000000),
systemNavigationBarDividerColor: null,
statusBarColor: null,
systemNavigationBarIconBrightness: Brightness.light,
statusBarIconBrightness: Brightness.dark,
statusBarBrightness: Brightness.light,
);
使用
白色
void main() {
runApp(MyApp());
//白色
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.light);
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: Scaffold(
backgroundColor: Colors.blue,
body: Container(),
),
);
}
}
image.png
黑色
void main() {
runApp(MyApp());
//黑色
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark);
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: Scaffold(
backgroundColor: Colors.white,
body: Container(),
),
);
}
}
黑色