I have a layout like this and I want to change the color of only the status bar as I have not used an Appbar.
Here's the code I have used for this:
class Home extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Column(children: [
Container(
color: Colors.green,
padding: EdgeInsets.all(15),
child: TextFormField(
cursorColor: Colors.green,
decoration: InputDecoration(
contentPadding:
EdgeInsets.symmetric(vertical: 0.0, horizontal: 10.0),
hintText: 'Search a product',
fillColor: Colors.white,
filled: true,
prefixIcon: Visibility(
visible: true,
child: Icon(
Icons.search,
color: Colors.grey.shade900,
),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(6),
borderSide: BorderSide(
color: Colors.grey.shade200, width: 1.5
)
),
)
),
),
//AND OTHER ELEMENTS
],),
),
);
}
}
I want to change the color of the status bar to a darker shade of green
In our main.dart
, we can use the SystemChrome
class:
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarColor: Colors.green
));