You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

自定义TextField粘贴时白色圆角覆盖边框的问题求助

自定义TextField粘贴时白色圆角覆盖边框的问题求助

各位Flutter开发者们好,我最近在使用自定义TextField组件时遇到了一个奇怪的问题:当我尝试往输入框里粘贴内容时,会出现一个带圆角的白色区域,直接把TextField的底部边框给盖住了。这和我预期的效果完全不符——我只希望粘贴操作的提示条(顶部的那个粘贴区域)正常显示,不应该出现这个遮挡边框的圆角部分。

我已经检查了输入框的Decoration配置,但还是没找到问题所在,下面是我的自定义TextField的完整代码,麻烦大家帮我看看哪里出问题了,谢谢!

TextField(
  controller: widget.controller,
  // focusNode: _internalFocusNode,
  keyboardType: widget.keyboardType,
  obscureText: widget.obscureText,
  inputFormatters: widget.inputFormatters,
  onChanged: widget.onChanged,
  onTap: widget.onTap,
  readOnly: widget.readOnly,
  enabled: widget.enabled,
  maxLength: widget.maxLength,
  cursorColor: AppColors.brandColorDark,
  style: textStyle,
  decoration: InputDecoration(
    hintText: widget.hintText,
    hintStyle: inputDecorationTheme.hintStyle
            ?.copyWith(fontWeight: FontWeight.w400) ??
        textTheme.bodyLarge
            ?.copyWith(color: AppColors.hintColor, fontWeight: fw400),
    prefixIcon: widget.prefixIconAsset != null
        ? Padding(
            padding: const EdgeInsets.symmetric(
                horizontal: 12.0, vertical: 10.0),
            child: SvgPicture.asset(widget.prefixIconAsset!,
                colorFilter: ColorFilter.mode(
                    widget.enabled ? iconColor : Colors.grey.shade400,
                    BlendMode.srcIn),
                width: 20.0,
                height: 20.0))
        : (widget.icon != null
            ? Padding(
                padding: const EdgeInsets.symmetric(
                    horizontal: 12.0, vertical: 10.0),
                child: Icon(widget.icon,
                    color: widget.enabled ? iconColor : Colors.grey.shade400,
                    size: 20.0))
            : null),
    prefixIconConstraints: (widget.prefixIconAsset != null || widget.icon != null)
        ? const BoxConstraints(minHeight: 40, minWidth: 40)
        : null,
    suffixIcon: widget.suffixIconAsset != null
        ? IconButton(
            icon: SvgPicture.asset(widget.suffixIconAsset!,
                width: 20,
                height: 20,
                colorFilter: ColorFilter.mode(
                    widget.enabled ? iconColor : Colors.grey.shade400,
                    BlendMode.srcIn)),
            onPressed: widget.enabled ? widget.onSuffixIconTap : null,
            splashRadius: 20,
          )
        : null,
    suffixIconConstraints: widget.suffixIconAsset != null
        ? const BoxConstraints(minHeight: 40, minWidth: 40)
        : null,
    filled: true,
    fillColor: widget.enabled
        ? (inputDecorationTheme.fillColor ?? AppColors.whiteColor)
        : AppColors.whiteColor,
    contentPadding: currentContentPadding,
    border: defaultBorder,
    enabledBorder: hasError ? errorBorder : defaultBorder,
    focusedBorder: hasError ? focusedErrorBorder : focusedBorder,
    errorBorder: errorBorder,
    focusedErrorBorder: focusedErrorBorder,
    disabledBorder: disabledBorder,
    errorText: widget.errorText,
    errorStyle: inputDecorationTheme.errorStyle ??
        TextStyle(color: errorColor, fontSize: 12),
    errorMaxLines: 2,
  ),
)

补充说明:我已经定义了各种Border样式(比如defaultBorder、focusedBorder这些),它们都是OutlineInputBorder,设置了对应的圆角和边框颜色,正常状态下输入框的边框显示完全没问题,只有粘贴操作触发时才会出现这个遮挡的白色圆角区域。

内容来源于stack exchange

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.04.07 08:55:28