Flutter apple native Pinyin keyboard input exception on textfield | Pinyin input process callback problem

Flutter Normal text callback passed onChange Handle , It can also be done through monitor TextEditingController Handle

monitor TextEditingController

adopt value.composing To judge , The first judgment is entered directly , Then return directly to a normal style . The second judgment is that there are unfinished characters ,**value.composing.textInside(value.text)** What you get is the input of incomplete characters , The default is to add an underline style , Similar to a gray black background in apple native input , In this way, you can directly achieve the same effect as the native Chinese keyboard input .

therefore Direct inheritance TextEditingController Rewrite this rich text method to handle

class ChangeTextEditingController extends TextEditingController {
  var completeText = '';

	//  There are other methods that can be directly added here to inherit   Use  
  ChangeTextEditingController.fromValue(TextEditingValue value)
      : super.fromValue(value);

  @override
  TextSpan buildTextSpan(
      {BuildContext context, TextStyle style, bool withComposing}) {
    /// Pinyin input completed 
    if (!value.composing.isValid || !withComposing) {
      if (completeText != value.text) {
        completeText = value.text;
        WidgetsBinding.instance.addPostFrameCallback((_) {
          notifyListeners();
        });
      }
      return TextSpan(style: style, text: text);
    }

    /// Returns the input style , Customizable styles 
    final TextStyle composingStyle = style.merge(
      const TextStyle(decoration: TextDecoration.underline),
    );
    return TextSpan(style: style, children: <TextSpan>[
      TextSpan(text: value.composing.textBefore(value.text)),
      TextSpan(
        style: composingStyle,
        text: value.composing.isValid && !value.composing.isCollapsed
            ? value.composing.textInside(value.text)
            : "",
      ),
      TextSpan(text: value.composing.textAfter(value.text)),
    ]);
  }
}

application : On the initialization page or view initState add to

//  Initialization property 
  String lastInput = "";
  ChangeTextEditingController controller;

  @override
  void initState() {
    super.initState();

    controller = ChangeTextEditingController.fromValue(
      TextEditingValue(
        text: widget.defaultContent,
        selection: TextSelection.fromPosition(
          TextPosition(
              affinity: TextAffinity.downstream,
              offset: widget.defaultContent.length),
        ),
      ),
    );

    controller.addListener(() {
      if (lastInput != controller.completeText) {
        lastInput = controller.completeText;

        /// notice onChanged  Callback .
        _onChange(controller.completeText);
      }
    });
  }