How I can have a custom color for my StatusBar without the AppBar?
To customize the StatusBar color I used this code:
appBar: AppBar(
backgroundColor: Colors.teal
)
If I remove appbar I can't customize the StatusBar. How I can do this?
How can I remove the AppBar but keeping the StatusBar?
Add this in your main.dart's main method file after the runApp method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: <YOUR STATUS BAR COLOR>));
Like this:
void main(){
runApp(MyApp());
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: <YOUR STATUS BAR COLOR>));
}
If you are using SafeArea then you need to set it's top property to false.
You can also use this
@override
Widget build(BuildContext context) {
return Container(
color: Your Color Here,
child: SafeArea(
bottom: false,
child: Scaffold(
),
),
);
}
you can use the following code for change the status bar color first step you have to import this package given below
"import 'package:flutter/services.dart';
and then add this code in your main.dart file
void main(){SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(statusBarColor:Colors.blue,));}
Simply we can implemet using AppBar, in below code backgroundColor: Colors.green is applied to statusbar.
Scaffold(
appBar: AppBar(
systemOverlayStyle: SystemUiOverlayStyle.dark,
backgroundColor: Colors.green,
elevation: 0,
toolbarHeight: 0,
),
backgroundColor: Colors.white38,
body: Container(),
)
Prview:
