Flutter中如何在AutoSizeTextField中使用Validator验证器？

问题根源 #

AutoSizeTextField本身没有validator属性，它并非FormField子类，直接像TextFormField那样添加validator参数会触发报错。

解决方案 #

将AutoSizeTextField包裹在TextFormField内部，利用TextFormField提供的表单验证能力（包括validator、autovalidateMode等属性），通过TextFormField的builder方法渲染AutoSizeTextField，同时同步两者的状态参数。

修正后的代码 #

SizedBox(
  width: MediaQuery.of(context).size.width * 0.4,
  child: TextFormField(
    autovalidateMode: AutovalidateMode.onUserInteraction,
    controller: startDateController,
    inputFormatters: [
      FilteringTextInputFormatter.allow(RegExp("[- 0-9]")),
      LengthLimitingTextInputFormatter(10)
    ],
    keyboardType: TextInputType.datetime,
    decoration: const InputDecoration(
      errorStyle: TextStyle(fontSize: 0.05),
      prefixIcon: Icon(Icons.calendar_month),
      border: OutlineInputBorder(),
      hintStyle: TextStyle(fontSize: 12),
      labelStyle: TextStyle(fontSize: 12),
      labelText: 'Start Date',
      hintText: 'yyyy-MM-dd',
    ),
    validator: MultiValidator([
      RequiredValidator(errorText: 'Required*')
    ]),
    // 用builder渲染AutoSizeTextField，同步状态参数
    builder: (context, field) {
      return AutoSizeTextField(
        controller: field.controller,
        focusNode: field.focusNode,
        inputFormatters: field.inputFormatters,
        keyboardType: field.keyboardType,
        decoration: field.decoration,
        onTap: () async {
          DateTime? pickedDate = await showDatePicker(
            context: context,
            initialDate: DateTime.now(),
            firstDate: DateTime(1991),
            lastDate: DateTime(2101),
          ).then((pickedDate) {
            if (pickedDate != null) {
              String formattedDate = DateFormat('yyyy-MM-dd').format(pickedDate);
              setState(() {
                startDateController.text = formattedDate;
              });
            } else {
              print("Date is not selected");
            }
          });
        },
      );
    },
  ),
)

关键说明 #

• TextFormField承担表单验证的核心逻辑，AutoSizeTextField仅负责自适应文本大小的渲染工作。
• 通过builder参数的field对象，将TextFormField的controller、focusNode等状态参数传递给AutoSizeTextField，保证两者状态同步。
• 若使用MultiValidator和RequiredValidator，需确保项目已引入flutter_form_builder依赖，可在pubspec.yaml中添加：

  dependencies:
    flutter_form_builder: ^latest_version # 替换为最新版本号
  

内容的提问来源于stack exchange，提问作者Minal Suryawanshi