Flutter中如何实现TextFormField输入内容的首字母大写？

TextFormField和TextField底层都是封装的EditableText组件，官方设计里textCapitalization配置对二者的生效逻辑完全一致，出现不生效的情况可以按以下步骤排查和修复：

1 基础场景排查 #

首先确认你测试时使用的是系统原生输入法，部分第三方自定义输入法会忽略Flutter传递的大写配置，导致该属性不生效。

2 强制实现首字母大写（不受输入法限制） #

如果确认输入法没有问题，你可以搭配TextInputFormatter强制实现大写逻辑，100%适配所有场景：

• 首先导入services依赖：

import 'package:flutter/services.dart';

• 自定义对应需求的输入格式化类：
  如果是仅整段内容首字母大写：

class FirstLetterCapitalFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(TextEditingValue oldValue, TextEditingValue newValue) {
    if (newValue.text.isEmpty) return newValue;
    return newValue.copyWith(
      text: newValue.text[0].toUpperCase() + newValue.text.substring(1),
      selection: newValue.selection,
    );
  }
}

如果是每个单词首字母大写（对应你配置的TextCapitalization.words效果）：

class EachWordCapitalFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(TextEditingValue oldValue, TextEditingValue newValue) {
    if (newValue.text.isEmpty) return newValue;
    List<String> words = newValue.text.split(RegExp(r'\s+'));
    words = words.map((word) {
      if (word.isEmpty) return word;
      return word[0].toUpperCase() + word.substring(1);
    }).toList();
    String formatted = words.join(' ');
    return newValue.copyWith(
      text: formatted,
      selection: TextSelection.collapsed(offset: formatted.length),
    );
  }
}

• 将格式化类配置到TextFormField中：

TextFormField(
  textCapitalization: TextCapitalization.words,
  inputFormatters: [
    EachWordCapitalFormatter(),
  ],
  // 其余原有配置保持不变
)

注意事项 #

如果你通过TextEditingController从外部给输入框赋值，赋值时需要提前处理字符串的大写规则，避免外部插入的内容绕过输入格式化的处理。

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