hintText не отображается в строке

Question

Я пытаюсь выровнять значок и текст в текстовом поле, но вывод не такой, как я планировал, ниже мой код:

class _HomeScreenState extends State<HomeScreen> {
 @override
 Widget build(BuildContext context) {
  return Scaffold(
  appBar: AppBar(
    leading: IconButton(
      icon: Icon(Icons.account_circle),
      iconSize: 30.0,
      onPressed: () {
      },
    ),
    title: Text('Food Delivery'),
    centerTitle: true,
    actions: <Widget>[
      FlatButton(
        child: Text('Cart (${currentUser.cart.length})', 
        style: TextStyle(color: Colors.white, fontSize: 15.0),),
        onPressed: () {
        },
      )
    ],
  ),
  body: ListView(
    children: <Widget>[
      Padding(
        padding: EdgeInsets.all(20.0),
        child: TextField(
          decoration: InputDecoration(
            contentPadding: EdgeInsets.symmetric(vertical: 15.0),
            border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(30.0),
              borderSide: BorderSide(width: 0.8)
              ),
              hintText: 'Search Food or Restaurants',
              prefixIcon: Icon(Icons.search, size: 30.0,),
              suffix: IconButton(
                icon: Icon(Icons.clear),
                onPressed: () {

                },
              )
          ),

        ),
      ),
    ],
  ),
);
 }
}

Я не вижу, чтобы найти проблему, вывод на симуляторе и фактическом устройстве одинаков:

Я подумал, может быть, это проблема со значком поиска, однако уменьшение размера значок не изменил вывод. Может кто-нибудь предложить исправление, чтобы текст подсказки отображался в виде значка.

Answer 1

Как вы уже сказали, проблема с иконками в суффиксе / префиксе! Так что это альтернатива!

Container(
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(30),
                border: Border.all(color: Colors.white, width: 0.8)),
            padding: EdgeInsets.all(10.0),
            child: Row(
              children: <Widget>[
                Icon(
                  Icons.search,
                  size: 30.0,
                ),
                SizedBox(width: 10),
                Expanded(
                  child: TextField(
                    decoration: InputDecoration(
                      border:InputBorder.none,
                      contentPadding: EdgeInsets.symmetric(vertical: 15.0),
                      hintText: 'Search Food or Restaurants',
                    ),
                  ),
                ),
                IconButton(
                  icon: Icon(Icons.clear),
                  onPressed: () {},
                )
              ],
            ),
          ),

Answer 2

Проблема в контенте контента: EdgeInsets.symmetri c (по вертикали: 15) Попробуйте уменьшить его. Вертикальная обивка добавляет отступы сверху и снизу.