Build a code editor with syntax highlighter using TextField in Flutter


I am trying to build Code Editor in Flutter app using TextField, I tried using flutter_syntax_view but the problem is, it only accept code as a predefined string text and it does not have any option to write a code.

This is what I have tried:

  • Used TextField with maxLines 10
  • If we can show number of lines on left like code editor

Open for suggestions, appreciate the help


See my work on github:

It uses flutter_highlight, multicursor edits, minimap, line number gutter. Under development – you may want to contribute to that project.

I also wrote an article on creating an editor under 1000 lines of code in Flutter – wherein i explained why i ditched the textfield and made my own widget:

Answered By – Marvin Sanchez

Answer Checked By – David Goodson (FlutterFixes Volunteer)

Leave a Reply

Your email address will not be published. Required fields are marked *