How to display source code in flutter web?

Question

I want to display this source code in flutter web.

Widget build(BuildContext context) {
    return SafeArea(
      top: true,
      bottom: true,
      child: Scaffold(
        body: bodyView(),
      ),
    );
  }

Answer 1

You could use the package flutter_markdown it supports the backtick quotes to show formatted code. The package's example file has an example with dart code.

Code example:

const String _markdownData = """
## Code blocks
Formatted Dart code looks really pretty too:
    ```
    void main() {
      runApp(MaterialApp(
        home: Scaffold(
          body: Markdown(data: markdownData),
        ),
      ));
    }
    ```
""";

class MyWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  @override
  Widget build(BuildContext context) {
    final controller = ScrollController();

    return Scaffold(
      body: SafeArea(
        child: Markdown(
          controller: controller,
          selectable: true,
          data: _markdownData,
          imageDirectory: 'https://raw.githubusercontent.com',
        ),
      ),
    );
  }
}

Image