EN VI

flutter column inside scaffold not accounting for top bar?

How to flutter column inside scaffold not accounting for top bar

I have an issue with the widgets in my application starting from the top of the screen, underneath the top bar.

There is an official flutter thread about this where they just say "scaffold fixes this" and they closed the thread. This might be true, but it is not working the way I am doing it. So here is my code and the output:

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: <Widget>[
          Container(
            height: 50,
            width: 50,
            color: Colors.blueAccent,
          ),
        ],
      ),
    );
  }

Not sure how this is supposed to work, and can't find any working examples online.

Solution:

you should use SafeArea like this:

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: SafeArea(
        Column(
        children: <Widget>[
          Container(
            height: 50,
            width: 50,
            color: Colors.blueAccent,
          ),
        ],
      )
    ),
  );
}

Tags