CODEWITHSUNDEEP
androidiosflutterdartflutter-layout
Bunthong K
Bunthong K

Reputation: 134

Drawer Header Image Not filling the screen

so I was building a drawer inside my flutter app ( my first time using it) and then something bothers me. So when you put image in the drawer header , the image itself won't reach the top of the screen.

Picture :

enter image description here

And here is my code for the drawer :

drawer: Drawer(
        child: ListView(
          children: <Widget>[
            DrawerHeader(
              padding: EdgeInsets.zero,
              decoration: BoxDecoration(
                color: Colors.blue,
                image: DecorationImage(
                    fit: BoxFit.cover,
                    image: AssetImage("assets/images/fighters.jpg")),
              ),
              child: Center(
                child: Text(
                  "Menu",
                  style: TextStyle(
                    color: Colors.white,
                    fontWeight: FontWeight.bold,
                    fontSize: 30,
                  ),
                ),
              ),
            )
          ],
        ),
      ),

I didn't have any padding for the code

Please help me fix this , any help is appreciated , thank you!

Upvotes: 1

Views: 1021

Answers (2)

Jim
Jim

Reputation: 7601

try this:

drawer: SafeArea(
    top: false,
    child: Drawer(..),
  ),

OR

MediaQuery.removePadding(
          context: context,
          removeTop: true,
          child: ListView

Upvotes: 2

Jasmin Sojitra
Jasmin Sojitra

Reputation: 1299

Use Column instead of Listview.

drawer: Drawer(
            child: Column(
              children: <Widget>[
                DrawerHeader(
                  padding: EdgeInsets.zero,
                  decoration: BoxDecoration(
                    color: Colors.blue,
                    image: DecorationImage(
                        fit: BoxFit.cover,
                        image: AssetImage("assets/images/main_top.png")),
                  ),
                  child: Center(
                    child: Text(
                      "Menu",
                      style: TextStyle(
                        color: Colors.white,
                        fontWeight: FontWeight.bold,
                        fontSize: 30,
                      ),
                    ),
                  ),
                )
              ],
            ),
          ),

Upvotes: 0

Related Questions