How to get screen size without toolbar, bottomnavigationbar and etc height size in flutter?

Question

I want to create screen without appbar and bottomnavigationbar in flutter. but there is space of 77px height in flutter.

I think that this space will change in different devices. what is this space. I use Getx. My code is here:

Get.height - kToolbarHeight - kBottomNavigationBarHeight - 77

Why is there space 77 height?

Answer 1

The simplest straightforward way is to use LayoutBuilder widget:

Look at the following example:

  return Scaffold(
    appBar: AppBar(

      title: Text('Layout Builder demo'),
    ),
    body: LayoutBuilder(
      builder: (context, constraints) {
        print('screen width : ${constraints.maxWidth}');
        print('screen height : ${constraints.maxHeight}');
        return Container(
            width: constraints.maxWidth,
            height: constraints.maxHeight,
            color: Colors.green,
            child: Center(
              child: SingleChildScrollView(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: List.generate(50,(e)=>ListTile(title: Text('Tile No ${e+1}'),))
                )
              )
            )
            );
      },
     )
    );

You can get the body size excluding the app bar and bottom nav sizes.