textform 字段内的文本被填充

Question

我观察到以下表单字段的文本以某种方式被填充了。光标也变得非常小，像一个点。有什么想法吗？

我希望文本字段的高度与右侧圆形按钮的高度相同

  final border = OutlineInputBorder(
  borderSide: BorderSide(
    color: Colors.transparent,
  ),
  borderRadius: const BorderRadius.all(
    const Radius.circular(
      10.0,
    ),
  ),
);

return TextFormField(
  controller: controller,
  onChanged: onChanged,
  validator: validator,
  autovalidateMode: AutovalidateMode.onUserInteraction,
  cursorColor: Theme.of(context).highlightColor,
  style: GoogleFonts.poppins(
    color: Theme.of(context).highlightColor,
    fontSize: 16,
    fontWeight: FontWeight.w300,
    height: 0.1,
  ),
  textInputAction: TextInputAction.done,
  decoration: InputDecoration(
    fillColor: Theme.of(context).primaryColorLight,
    filled: true,
    enabledBorder: border,
    focusedBorder: border,
    border: border,
    labelText: labelText,

    // remove label while in focus
    floatingLabelBehavior: FloatingLabelBehavior.never,
    labelStyle: GoogleFonts.poppins(
      color: Theme.of(context).highlightColor,
      fontSize: 15,
      fontWeight: FontWeight.w300,
    ),
  ),
);

Answer 1

额外填充和小光标的原因是您设置为 0.1 的字体 height（如果您不想要，请保留默认值 1.0额外的填充）。

您可以通过设置 cursorHeight 以匹配您的原始字体大小来解决光标问题

注意：仅当您希望保持高度为 0.1

时才使用 cursorHeight

textform 字段内的文本被填充

Text inside textform field is padded up

flutter

flutter-layout

flutter-animation