flutter - 提示文本未内联显示

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: () {

                },
              )
          ),

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

我看不到问题所在，模拟器上的输出和实际设备上的输出是一样的：

我认为这可能是搜索图标的问题，但是，减小图标的大小并没有改变输出。任何人都可以建议修复以使提示文本与图标内联显示。

标签： fluttertextfield

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: () {},
                )
              ],
            ),
          ),