Flutter 文本字段将每个单词大写

如何解决Flutter 文本字段将每个单词大写

class InputMdnWidget extends StatefulWidget {
  const InputMdnWidget({Key key}) : super(key: key);
  @override
  _InputMdnWidgetState createState() => _InputMdnWidgetState();
}

class _InputMdnWidgetState extends State<InputMdnWidget> {
  TextEditingController _controller;
  
  @override
  void initState() {

    super.initState();
    _controller = TextEditingController();
  }
  @override
  Widget build(BuildContext context) {
    return TextField(
      controller: _controller,textCapitalization: TextCapitalization.words       
    );
  }
}

我是 flutter 新手，我有一个文本字段并使用控制器，我想制作用户在驼峰式大小写中输入的文本， 比如用户输入“lala lala”，文本框里的文字会变成“Lala Lala”，这可能吗，怎么做？

我使用 textCapitalization：TextCapitalization.words 不起作用

解决方法

这样您也可以处理 web。您也可以查看format explanation的这个答案。

把它放在某个地方

extension CapExtension on String {
  String get inCaps =>
      this.length > 0 ? '${this[0].toUpperCase()}${this.substring(1)}' : '';

  String get capitalizeFirstofEach => this
      .replaceAll(RegExp(' +'),' ')
      .split(" ")
      .map((str) => str.inCaps)
      .join(" ");
}

并像 text.capitalizeFirstofEach 一样使用它。

import 'package:flutter/material.dart';

class Expandeddd extends StatefulWidget {
  Expandeddd({Key? key}) : super(key: key);

  @override
  _ExpandedddState createState() => _ExpandedddState();
}


class _ExpandedddState extends State<Expandeddd> {
  final controller = TextEditingController();

  @override
  void initState() {
    super.initState();
    controller.addListener(() {
      final text = controller.text;

      /// dont set Text here
      controller.selection =
          TextSelection.fromPosition(TextPosition(offset: text.length));
    });
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        constraints: BoxConstraints(
          maxHeight: 812,minHeight: 300,),child: Column(
          children: [
            TextField(
              controller: controller,textCapitalization: TextCapitalization.words,keyboardType: TextInputType.text,autocorrect: false,onChanged: (value) {
                controller.text = value.capitalizeFirstofEach;
              },style: TextStyle(
                fontSize: 30.0,color: Colors.black,fontWeight: FontWeight.bold,],);
  }
}

,

您可以尝试使用 TextInputFormatters。这些使输入符合特定模式，并且可以像这样提供给 TextFields：

TextField(
  controller: _controller,inputFormatters: [MyInputFormatter()],);

如果您想要自定义格式，并且我认为您想要“标题大小写”，您可以通过像这样扩展类来创建自己的 TextInputFormatter：

import 'package:flutter/services.dart';

class TitleCaseInputFormatter extends TextInputFormatter {
  String textToTitleCase(String text) {
    if (text.length > 1) {
      return text[0].toUpperCase() + text.substring(1);
      /*or text[0].toUpperCase() + text.substring(1).toLowerCase(),if you want absolute title case*/
    } else if (text.length == 1) {
      return text[0].toUpperCase();
    }

    return '';
  }

  @override
  TextEditingValue formatEditUpdate(
      TextEditingValue oldValue,TextEditingValue newValue) {
    String formattedText = newValue.text
        .split(' ')
        .map((element) => textToTitleCase(element))
        .toList()
        .join(' ');
    return TextEditingValue(
      text: formattedText,selection: newValue.selection,);
  }
}

再次使用它：

TextField(
  controller: _controller,inputFormatters: [TitleCaseInputFormatter()],);