我正在尝试改变状态栏的颜色为白色。我偶然发现了这家酒吧。我尝试在我的dart文件中使用示例代码。
当前回答
你可以在Android上使用:
import 'package:flutter/services.dart';
void main() {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
systemNavigationBarColor: Colors.blue, // navigation bar color
statusBarColor: Colors.pink, // status bar color
));
}
其他回答
你可以在Android上使用:
import 'package:flutter/services.dart';
void main() {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
systemNavigationBarColor: Colors.blue, // navigation bar color
statusBarColor: Colors.pink, // status bar color
));
}
对于那些使用AppBar的人
如果你使用AppBar,那么更新状态栏颜色就像这样简单:
Scaffold(
appBar: AppBar(
// Use [Brightness.light] for black status bar
// or [Brightness.dark] for white status bar
// https://stackoverflow.com/a/58132007/1321917
brightness: Brightness.light
),
body: ...
)
申请所有应用程序栏:
return MaterialApp(
theme: Theme.of(context).copyWith(
appBarTheme: Theme.of(context)
.appBarTheme
.copyWith(brightness: Brightness.light),
...
),
对于那些不使用AppBar的人
用AnnotatedRegion包装您的内容,并将值设置为SystemUiOverlayStyle。light或SystemUiOverlayStyle.dark:
return AnnotatedRegion<SystemUiOverlayStyle>(
// Use [SystemUiOverlayStyle.light] for white status bar
// or [SystemUiOverlayStyle.dark] for black status bar
// https://stackoverflow.com/a/58132007/1321917
value: SystemUiOverlayStyle.light,
child: Scaffold(...),
);
使用这种方法使你的状态栏完全白色的状态栏图标, 我个人使用它!在android上测试工作很好!
import 'package:FileSharing/bodypage.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
theme: ThemeData(
// This is the theme of your application.
//
// Try running your application with "flutter run". You'll see the
// application has a blue toolbar. Then, without quitting the app, try
// changing the primarySwatch below to Colors.green and then invoke
// "hot reload" (press "r" in the console where you ran "flutter run",
// or simply save your changes to "hot reload" in a Flutter IDE).
// Notice that the counter didn't reset back to zero; the application
// is not restarted.
primarySwatch: Colors.blue,
appBarTheme: AppBarTheme(
color: Colors.white,
elevation: 0,
brightness: Brightness.light,
centerTitle: true,
iconTheme: IconThemeData(
color: Colors.black,
),
textTheme: TextTheme(),
)
// This makes the visual density adapt to the platform that you run
// the app on. For desktop platforms, the controls will be smaller and
// closer together (more dense) than on mobile platforms.
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarColor: Colors.white,
));
return Scaffold(
appBar: AppBar(
brightness: Brightness.light,
actions: [
Container(
width: 63,
padding: EdgeInsets.only(right: 30),
child: FloatingActionButton(
onPressed: null,
backgroundColor: Colors.pink,
elevation: 8,
child: Icon(Icons.person_pin),
),
)
],
),
);
}
}
在主要的。飞镖文件 导入服务如下
import 'package:flutter/services.dart';
在build方法中,在返回之前添加这一行
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarColor: Colors.orange
));
是这样的:
@override
Widget build(BuildContext context) {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarColor: CustomColors.appbarcolor
));
return MaterialApp(
home: MySplash(),
theme: ThemeData(
brightness: Brightness.light,
primaryColor: CustomColors.appbarcolor,
),
);
}
当您不使用AppBar时,更改状态栏的颜色
首先导入这个
import 'package:flutter/services.dart';
现在使用下面的代码改变状态栏的颜色在你的应用程序,当你不使用AppBar
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.dark.copyWith(
statusBarColor: AppColors.statusBarColor,/* set Status bar color in Android devices. */
statusBarIconBrightness: Brightness.dark,/* set Status bar icons color in Android devices.*/
statusBarBrightness: Brightness.dark)/* set Status bar icon color in iOS. */
);
在iOS中使用安全区域时,更改状态栏的颜色
Scaffold(
body: Container(
color: Colors.red, /* Set your status bar color here */
child: SafeArea(child: Container(
/* Add your Widget here */
)),
),
);