如何在Flutter中将TextFormField的第一个字母大写

Question

我正在尝试将Textformfield的第一个字母大写，为此我使用了

textCapitalization: TextCapitalization.words,

它对于Textformfield不起作用，但对于textfield起作用。

请帮忙解决如何做到这一点。

- TimeToCode

Answer 1

尝试下面的代码，希望对您有所帮助。请参考TextCapitalization这里

• 大写首字母 TextCapitalization.words
• 每个字母都大写 TextCapitalization.characters
• 大写文本字段的第一个字母 TextCapitalization.sentences
• 文本字段默认小写字母 TextCapitalization.none

您的小部件：

   TextField(
      textCapitalization: TextCapitalization.words,
      decoration: InputDecoration(
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(10),
        ),
        prefixIcon: Icon(
          Icons.search,
        ),
        hintText: 'Search',
      ),
    ),

使用 TextCapitalization.words 的结果屏幕：

使用 TextCapitalization.characters 的结果屏幕：

使用 TextCapitalization.sentences 的结果屏幕：

使用 TextCapitalization.none 的结果屏幕：

- Ravindra S. Patil

Answer 2

您可以尝试使用大写格式化程序，在中，只需在输入格式化程序部分使用类。

TextFormField(
            controller: _textEditingController,
            inputFormatters: <TextInputFormatter>[
              UpperCaseTextFormatter()
            ],
          )

大写文本格式化程序

class UpperCaseTextFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(TextEditingValue oldValue, TextEditingValue newValue) {
    return TextEditingValue(
      text: capitalize(newValue.text),
      selection: newValue.selection,
    );
  }
}
String capitalize(String value) {
  if(value.trim().isEmpty) return "";
  return "${value[0].toUpperCase()}${value.substring(1).toLowerCase()}";
}

输出：

- Jahidul Islam

---

在句号后大写首字母如何？ - Choy

这只是一个单词。 - Jahidul Islam

Answer 3

TextFormField(
       textCapitalization: TextCapitalization.words,
       ),

这个功能可以将我们在TextFormField中输入的每个单词的首字母大写。

设置textCapitalization后，请在模拟器或设备实例上重新构建并再次检查。如果有效，请告诉我，

- Safeela Nasarin

---

比当前被接受的答案好多了。简洁明了。 - MarcoFerreira

Answer 4

为了让它与TextFormField一起工作，您必须添加：

textCapitalization: TextCapitalization.sentences // Capital first letter
keyboardType: TextInputType.text, 

例如，使用keyboardType: TextInputType.name时，它不起作用。

- debovitch

Answer 5

如果您使用的是TextFormField而不是TextField，请使用以下代码：textCapitalization: TextCapitalization.sentences。这将使首字母大写。可以与其他属性一起使用。

keyboardType: TextInputType.text,  

- reeco

Answer 6

我只是在完善Safeela Nasarin的答案，这个答案很有效。

只需确保使用嵌入式模拟器键盘或设备嵌入式键盘，具体取决于您的情况。它不会与外部或计算机键盘一起使用。

- Dieu le veut Nkenye

Answer 7

Jahidul Islam的答案对我没有用，因为我需要将句子中的所有单词都大写。 textCapitalization属性无法胜任此工作，因为它只是通过自动大写键盘向用户提供建议，而我的要求是输入必须是单词大写的。

所以我需要自己实现它，使用Jahidul提供的基本TextEditingValue。这会改变输入，因此用户无法违反我们对该字段的要求。

希望能帮助其他人。

class UpperCaseTextFormatter extends TextInputFormatter {
  @override
  TextEditingValue formatEditUpdate(
      TextEditingValue oldValue, TextEditingValue newValue) {
    return TextEditingValue(
      text: capitalizeAllWordsInFullSentence(newValue.text),
      // text: capitalizeAllWordsInFullSentence(newValue.text),
      selection: newValue.selection,
    );
  }
}

String capitalizeAllWordsInFullSentence(String str) {
  int i;
  String constructedString = "";
  for (i = 0; i < str.length; i++) {
    if (i == 0) {
      constructedString += str[0].toUpperCase();
    } else if (str[i - 1] == ' ') {
      // mandatory to have index>1 !
      constructedString += str[i].toUpperCase();
    } else {
      constructedString += str[i];
    }
  }
  // print('constructed: $constructedString');
  return constructedString;
}

String capitalize1Word(String value) {
  if (value.trim().isEmpty) return "";
  return "${value[0].toUpperCase()}${value.substring(1).toLowerCase()}";
}

- MarcoFerreira

Answer 8

我遇到了同样的问题，TextCapitalization.sentences 或 TextCapitalization.words 对我不起作用，因为有 keyboardType: TextInputType.name。当我将其更改为 keyboardType: TextInputType.text 时，textCapitalization 在句子和单词中都开始工作。

- Siddharth Mehra

Answer 9

最好的方法是使用onchanged。

TextField(
controller: mytext,
onChanged: (value) {               
  mytext.value = TextEditingValue(
      text: value.toUpperCase(), 
      selection: mytext.selection
  );
}
)

- Muhammad Ullah

Answer 10

你可以将TextFormField中的每个单词都大写。

创建一个方法。

    String _capitalizeWords(String text) {
    if (text == null || text.isEmpty) {
      return text;
    }
    List<String> words = text.split(' ');
    for (int i = 0; i < words.length; i++) {
      if (words[i].isNotEmpty) {
        words[i] = words[i][0].toUpperCase() + words[i].substring(1);
      }
    }
    return words.join(' ');
  }

在你的TextFormField中， 在onchange属性中，你可以调用这个方法，它会返回首字母大写的单词。

    TextFormField(
        other properties ...
        onChanged: (text) {
                   .textController.value = textController.value.copyWith(
                    text: _capitalizeWords(text),
                    selection: TextSelection.collapsed(offset: text.length),
                    );
                },
...
),

- Ankitraj dwivedi