Set status bar style easily for each page
Simple widget to set status bar style and system bar navigation style.
You don't need to use SystemChrome and you don't need to keep update the system ui overlay for each page, you can easily save the status bar style and system bar navigation style when user push to new page and the pop to previouse page all of this noisy logic hidden behing StatusBarStyle
& SystemNavigationBarStyle
widgets.
dependencies:
easy_bar_style: [latest-version]
use this widget to set status bar color and icon brightness.
Name | Type | Description | Andoird | iOS |
---|---|---|---|---|
color | Color? | The color of the status bar | ✅ | ❌ |
brightness | Brightness? | The brightness of the status bar icons, when it's null wil try to get the proper value from the given color | ✅ | ✅ |
maintainState | bool | Restort the style when pop again to the page, default true | ✅ | ✅ |
@override
Widget build(BuildContext context) {
return StatusBarStyle(
brightness: Brightness.dark,
color: Colors.white60,
maintainState: true,
child: Container(color: Colors.red,),
);
}
use this widget to set system navigation bar color and icon brightness.
Name | Type | Description | Andoird | iOS |
---|---|---|---|---|
color | Color? | The color of the system bottom navigation bar | ✅ | ❌ |
dividerColor | Color? | The color of the divider between the system's bottom navigation bar and the app's content | ✅ | ❌ |
iconBrightness | Brightness? | The brightness of the system navigation bar icons, when it's null wil try to get the proper value from the given color | ✅ | ❌ |
maintainState | bool | Restort the style when pop again to the page, default true | ✅ | ❌ |
@override
Widget build(BuildContext context) {
return SystemNavigationBarStyle(
brightness: Brightness.dark,
color: Colors.deepOrangeAccent,
maintainState: true,
child: Container(color: Colors.red,),
);
}
you can use the StatusBarStyle
& SystemNavigationBarStyle
togther using EasyStyle
widget
@override
Widget build(BuildContext context) {
return EasyStyle(
styles: const [
SystemNavigationBarStyle(
color: Colors.brown,
iconBrightness: Brightness.light,
),
StatusBarStyle(
color: Colors.red,
brightness: Brightness.light,
),
],
child: Container(color: Colors.green),
);
}
instead of:
@override
Widget build(BuildContext context) {
return SystemNavigationBarStyle(
color: Colors.brown,
iconBrightness: Brightness.light,
child: StatusBarStyle(
color: Colors.red,
brightness: Brightness.light,
child: Container(color: Colors.green),
),
);
}
** Note
if you are using Scafold
widget with AppBar
widget set systemOverlayStyle to app directly and no need to use this package