如何调整TextField的后缀/ suffixIcon高度？

很好的问题...

基础是重置TextField中的所有填充，而不使用IconButton（因为所有Material组件都具有无法修改的预定义填充和内部填充）。

似乎后缀的基线与文本对齐，从而防止了材质墨水的交互，而后缀图标在文本区域中正确居中，但BUT会将墨水传播到TextField。因此，到目前为止，我找不到正确执行此操作的方法，也许我缺少一个小部件/逻辑。

检查底部的屏幕截图，该屏幕截图显示了后缀为什么不能与文本对齐的原因，因为它位于基线本身之内，而插入符号会产生更大的高度.....

在前两个文本字段中，“灰色”框是后缀，黄色是suffixIcon（正确居中）。

解决方案1 ​​：（在screenshotm中为带有2个复选框的红色背景）如果可以（在设计方面），请一行，然后将TextField和图标放入：

var inputBorderDecoration = OutlineInputBorder(
        borderRadius: BorderRadius.zero,
        borderSide: BorderSide(width: 1, color: Colors.black));

    double textHeight = 40;

    // define a width if you want, or let the constrains of the parent define it.
    double inputWidth = double.infinity;

    return Center(
      child: Container(
          width: inputWidth,
          height: textHeight,
          color: Colors.green.withOpacity(.2),
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: <Widget>[
              Flexible(
                child: TextField(
                  controller: TextEditingController(text: 'hello world'),
                  style: TextStyle(fontSize: textHeight),
                  decoration: InputDecoration(
                    contentPadding: EdgeInsets.zero,
                    enabledBorder: inputBorderDecoration,
                    focusedBorder: inputBorderDecoration,
                    filled: true,
                    fillColor: Colors.red.withOpacity(.5),
                  ),
                ),
              ),
              FittedBox(
                child: InkWell(
                  onTap: () => print("touch button"),
                  child: Icon(Icons.check_circle),
                ),
              ),
            ],
          )),
    );

解决方案2：（在屏幕截图中，最后一个文本字段，带有白色图标的绿色框）包装图标装饰是一种较好的UI方法，但是TextField仍将接收触摸事件。

var inputBorderDecoration = OutlineInputBorder(
        borderRadius: BorderRadius.zero,
        borderSide: BorderSide(width: 1, color: Colors.black));

    double fontSize = 24;
    return GestureDetector(
      onTap: () {
        FocusScope.of(context).requestFocus(FocusNode());
      },
      child: Container(
        color: Colors.green.shade50,
        child: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Container(
                width: 300,
                height: fontSize,
                color: Colors.orange,
                child: TextField(
                  style: TextStyle(fontSize: fontSize, color: Colors.white),
                  decoration: InputDecoration(
                    fillColor: Colors.purple.withOpacity(.5),
                    filled: true,
                    border: inputBorderDecoration,
                    focusedBorder: inputBorderDecoration,
                    enabledBorder: inputBorderDecoration,
                    contentPadding: EdgeInsets.zero,
                    suffixIcon: GestureDetector(
                      onTap: () => print('on tap'),
                      child: Container(
                        color: Colors.green,
                        child: FittedBox(
                          alignment: Alignment.center,
                          fit: BoxFit.fitHeight,
                          child: IconTheme(
                            data: IconThemeData(),
                            child: Icon(
                              Icons.check_circle,
                              color: Colors.white,
                            ),
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );

解决方案3：

使用EditableText自己构建装饰