Blocks - Code blocks, Inline Code, RobotoMono font

[adrian-moisa]

Current source code uses a regular font as it was done in Flutter Quill. Which is not the way code editors handle this situation.

Join on discord to get advice and help or follow us on YouTube Visual Coding to learn more about the architecture of Visual Editor and other Flutter apps.

[kairan77]

You are supposed to feed your required style for each different tags when creating the editor, there you can specify which font family to use, the source code of quill in general is style agnostic, meaning all styles of all the different types of fragment are supposed to be SET BY the USER.

customStyles: DefaultStyles(
...
code: DefaultTextBlockStyle(
      const TextStyle(
        fontFamily: 'RobotoCondensed', // fill in your favorite mono font
        color: Colors.black87,
        fontSize: 15,
        height: 1.4,
      ),
      const Tuple2(0, 10),
      const Tuple2(0, 5),
      const BoxDecoration(
        color: Color(0xFFFCFCFC),
        borderRadius: BorderRadius.all(Radius.circular(5)),
      ),
    ),
)

[adrian-moisa]

Yes indeed, you can override styles, but that does not mean you can't provide a decent default value. Right? Code is never displayed in fonts that are not mono space for practical reasons. A sensible default does not harm. Quill Also decides a default font size. Obviously, it has to do so. Then if the font size has a default, why not a default for the code snippets? Any decent .md implementation will do the same for code snippets. Why not Quill?

[DariusMuscalu]

Also included in this commit:

• Added a distinct icon for code block button in the toolbar, because it was using the same icon as inline code button.