How to change the whole background color of Drawer in Flutter

Question

first of all i'm new to flutter and so i am quite confused how to change the "whole" background color in drawer flutter.

i managed to change my ListTile and my so called DrawerHeader to the color i want but the rest (below the ListTile is all white). And there is a line below the DrawerHeader that i don't really want but i can't get rid of it.

here is the code

    import 'package:flutter/material.dart';
import '../style/theme.dart' as style;

class MyDrawer extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      // width: MediaQuery.of(context).,
      child: Drawer(
        elevation: 0,
        child: ListView(
          children: <Widget>[
            Container(
              height: 170,
              width: 170,
              padding: EdgeInsets.only(top:30),
              color: style.Colors.secondColor,
              child: Column(children: <Widget>[
                Material(
                  borderRadius: BorderRadius.all(Radius.circular(100)),
                  child: Padding(padding: EdgeInsets.all(20.0),
                  child: Image.asset('images/circle.png',width: 80, height: 80,),),
                  //TODO ganti logo
                ),
              ],),
            ),
            Container(
              color: style.Colors.secondColor,
              child: Column(
                children: <Widget>[
                  ListTile(
                    leading: Icon(Icons.help_outline_sharp),
                    title: Text('Help', style: TextStyle(fontSize: 18,),),
                    onTap: () {},
                  ),
                  ListTile(
                    leading: Icon(Icons.person),
                    title: Text('About us', style: TextStyle(fontSize: 18,),),
                    onTap: () {},
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

here is the photo of the current situation

Here is the photo

Another Question what if i want to put a single ListTile on the bottom? (like log out)

Answer 1

For changing the background color of drawer you can just swap the Drawer Widget with Container and give color to container

class MyDrawer extends StatelessWidget {
@override
  Widget build(BuildContext context) {
    return Drawer(
        elevation: 0,
        child: Container(
          color: Colors.blue,
        child: ListView(
          children: <Widget>[
            Container(
              height: 170,
              width: 170,
              padding: EdgeInsets.only(top:30),
              color: Colors.red,
              child: Column(children: <Widget>[
                Material(
                  borderRadius: BorderRadius.all(Radius.circular(100)),
                  child: Padding(padding: EdgeInsets.all(20.0),
                  child: Image.asset('images/circle.png',width: 80, height: 80,),),
                ),
              ],),
            ),
            Container(
              color: Colors.red,
              child: Column(
                children: <Widget>[
                  ListTile(
                    leading: Icon(Icons.help_outline_sharp),
                    title: Text('Help', style: TextStyle(fontSize: 18,),),
                    onTap: () {},
                  ),
                  ListTile(
                    leading: Icon(Icons.person),
                    title: Text('About us', style: TextStyle(fontSize: 18,),),
                    onTap: () {},
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}

This can be the final code you can use, it has answer to all your three questions

class MyDrawer extends StatelessWidget {
 @override
  Widget build(BuildContext context) {
    return Drawer(
      child: Column(
        children: <Widget>[
          Expanded(
            child: ListView(
              children: <Widget>[
                Container(
                  height: 170,
                  width: 170,
                  padding: EdgeInsets.only(top:30),
                  color: Colors.blue,
                  child: Column(children: <Widget>[
                    Material(
                      borderRadius: BorderRadius.all(Radius.circular(100)),
                      child: Padding(padding: EdgeInsets.all(20.0),
                                     child: Image.asset('images/circle.png',width: 80, height: 80,),),
                    ),
                  ],
                 ),
                ),
                ListTile(
                  leading: Icon(Icons.help_outline_sharp),
                  title: Text('Help', style: TextStyle(fontSize: 18,),),
                  onTap: () {},
                ),
                ListTile(
                  leading: Icon(Icons.person),
                  title: Text('About us', style: TextStyle(fontSize: 18,),),
                  onTap: () {},
                ),
              ],
            ),
          ),
          Align(
            alignment: Alignment.bottomCenter,
            child: ListTile(
              leading: Icon(Icons.logout),
              title: Text('Logout')
            ),
          ),
        ],
      ),
    );
  }
}