skip to Main Content

I understand the TextField is primarily for plain text, but I have seen it is possible to display richly formatted text inside. I am a beginner with Flutter though and don’t quite understand what is being demonstrated. It appears that the text input is being formatted based on a RegEx as opposed to coming from data being streamed in.

I would like guidance on how to richly format text in a TextField and also how I can gain access to the RenderParagraph render object in order to compute things like text positions on the screen.

Thank you!

2

Answers


  1. TextField is primarily used for plain text input, you can achieve rich text formatting by using the TextEditingController and TextSpan classes. However, please note that formatting within a TextField might not be as versatile or as powerful as working with a widget designed specifically for rich text editing, like TextFormField combined with a SelectableText or a package like flutter_rich_text_editor

    Login or Signup to reply.
  2. See Flutter Textfield has a controller which is of TextEditingController type and it handle the inputs and can perform action accordingly to them for the TextField.

    And In the answer you mentioned, he/she is making a custom RichTextFieldController that extends TextEditingController, enabling rich formatting within a TextField.

    It utilizes defined patterns and associated TextStyle rules to format different parts of the input text, allowing features like @mentions, #hashtags, bold, italic, and more.

    The overridden buildTextSpan method applies the formatting styles based on the matched patterns, creating a dynamic styled TextSpan.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search