Set Change Status Bar Background Color in Flutter Android iOS Example

Status bar has by default gray background color. But sometimes app developer need to change the background color of Status bar. We can set status bar background color using SystemChrome.setSystemUIOverlayStyle() method. The system chrome package is used to set specific aspect of android and iOS mobile operating system. The system chrome has its own parameter known as statusBarColor which is used to Set Change Status Bar Background Color in Flutter Android iOS App Example Tutorial.

Contents in this project Set Change Status Bar Background Color in Flutter Android iOS Example:

1. Import material.dart and services.dart package in your app’s main.dart file.

2. Call our main MyApp class using void main runApp() method.

3. Create our main MyApp class extends with State less widget.

4. Create Widget build area in MyApp class and just before starting Material App we have to define System Chrome and call the statusBarColor. We are using Hex color code here to set status bar background color. You can also user here color in any format.

Here 0xff + HEX COLOR CODE

  • statusBarColor : Used to set background color of Status bar.

5. Creating Scaffold widget and make a Text widget in Center widget.

6. Complete source code for main.dart file:

Screenshot:

Leave a Reply

Your email address will not be published. Required fields are marked *