How to make the background of TextField rectangular box shape?

Question

I tried making Container widget with rectangle shape in TextField. It doesn't show my text inside container. Rather the box shape comes above TextField.

Here's my code:

 new Container(
            height: 10.0,
            width: 20.0,
              decoration: new BoxDecoration(
                shape: BoxShape.rectangle,
                border: new Border.all(
                  color: Colors.black,
                  width: 1.0,
                ),
              ),
            child: new TextField(
              textAlign: TextAlign.center,
              decoration: new InputDecoration(
                hintText: '1',
                border: InputBorder.none,

              ),
            ),
            ),

Answer 1

Just remove the height and width property of the container.

Example:

   new Container(
      decoration: new BoxDecoration(
        shape: BoxShape.rectangle,
        border: new Border.all(
          color: Colors.black,
          width: 1.0,
        ),
      ),
      child: new TextField(
        textAlign: TextAlign.center,
        decoration: new InputDecoration(
          hintText: '1',
          border: InputBorder.none,

        ),
      ),
    )

or else just specify the border property of InputDecoration like

new TextField(
      textAlign: TextAlign.center,
      decoration: new InputDecoration(
        hintText: '1',
        border: new OutlineInputBorder(
          borderRadius: const BorderRadius.all(
            const Radius.circular(0.0),
          ),
          borderSide: new BorderSide(
            color: Colors.black,
            width: 1.0,
          ),
        ),
      ),
    )

Hope that helps

Answer 2

         TextField(
                  decoration: InputDecoration(
                  enabledBorder: OutlineInputBorder(
                  borderSide: BorderSide(color: Colors.grey, width: 2.0),
                  ),
                  hintText: 'Email',
                  prefixIcon: Icon(Icons.mail_outline),
                ),
              ),

Output:

Answer 3

TextField(
  decoration: InputDecoration(
    filled: true, // <- this is required.
    border: const OutlineInputBorder(
      borderRadius: kStadiumBorderRadius,
      borderSide: BorderSide.none,
    ),
  ),
);