Flutter: Setting the height of the AppBar

Use toolbarHeight:

enter image description here


There's no longer a need to use PreferredSize. Use toolbarHeight with flexibleSpace.

AppBar(
  toolbarHeight: 120, // Set this height
  flexibleSpace: Container(
    color: Colors.orange,
    child: Column(
      children: [
        Text('1'),
        Text('2'),
        Text('3'),
        Text('4'),
      ],
    ),
  ),
)

You can use PreferredSize and flexibleSpace for it:

appBar: PreferredSize(
  preferredSize: Size.fromHeight(100.0),
  child: AppBar(
    automaticallyImplyLeading: false, // hides leading widget
    flexibleSpace: SomeWidget(),
  )
),

This way you can keep the elevation of AppBar for keeping its shadow visible and have custom height, which is what I was just looking for. You do have to set the spacing in SomeWidget, though.


You can use PreferredSize:

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