Change AppBar Height In Flutter

In this article, you will learn How to change AppBar Height in your Flutter Application.

Creating AppBar

main.dart

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(100.0),
          child: AppBar(
            title: Text('Home'),
            centerTitle: true,
          ),
        ),
        body: Center(
          child: Text('Codesource.io'),
        ),
      ),
    );
  }
}

Here, you have a simple Scaffold with AppBar. If you want to add extra height to your AppBar you have to use the PreferredSize() widget as AppBar doesn’t have height property by default. PreferredSize have two properties i.e

• preferredSize: it takes the Size property and you can then choose fromHeight method to give extra height to your AppBar.
• child: the child widget which is AppBar.

Result