How to get status bar height in Flutter?

The general method to obtain the status bar height in Flutter is by using the MediaQuery class. The MediaQuery class provides various details about media query data, including device screen dimensions, orientation, and the sizes of different system interface components, such as the status bar height.

Here is a specific example demonstrating how to retrieve and utilize the status bar height within a Flutter application:

dart
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // Retrieve the status bar height
    double statusBarHeight = MediaQuery.of(context).padding.top;

    return Scaffold(
      appBar: AppBar(
        title: Text("Status Bar Height Example"),
      ),
      body: Center(
        child: Text(
          "The status bar height is: $statusBarHeight pixels",
          style: TextStyle(fontSize: 20),
        ),
      ),
    );
  }
}

In this example, we first import the necessary Flutter material package. Next, we define a basic Flutter application and a simple home screen HomeScreen. Within the build method of HomeScreen, we use MediaQuery.of(context).padding.top to fetch the status bar height and display it centered on the screen.

This approach ensures accurate retrieval of the status bar height across all devices (whether iOS or Android) without requiring any additional third-party libraries.