flutter AppBar height

Jan 12, 2022 AppBar

How to add flutter AppBar height?

whenever we need to change the flutter AppBar height of the widget. Initially We need to declare the Appbar widget in the scaffold of the flutter.

Firstly We need to declare the appbar widget in the in the file in which screen your using it .Appbar is declare as shown below code

Widget leadbycodePage() {
  AppBar appBar = AppBar(
    title: Text('LeadBycode'),
  );
  return Scaffold(
    appBar: appBar,
    body: /*
    page body
    */,
  );
}

We need to change the height of the appbar so following code can be added as shown below

double height = appBar.preferredSize.height;

we can change the height using the preferred size

We can use the height to reduce the screen size

final double height = MediaQuery.of(context).size.height;

We can use the following code also for AppBar Height In Flutter

var height = AppBar().preferredSize.height;

for AppBar Height In Flutter with this custom height we can use the

  1. height of status bar
  2. height of app bar
  3. height of bottom app bar

The following code for flutter AppBar height can be added as follows

class flutterApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Lead by code ',
      home: Scaffold(
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(40.0), // here the desired preferred height
          child: AppBar(
            // ...
          )
        ),
        body: // ...
      )
    );
  }
}