如何在Flutter Web中显示源代码？

Question

我想在Flutter Web中显示此源代码。

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

Answer 1

我的上一个答案已被主持人删除，因此这次我将通过一个具体示例将其重新发布。

您可以使用支持反引号的软件包flutter_markdown来显示格式化的代码。程序包的示例文件中有一个带有dart代码的示例。

代码示例：

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',
        ),
      ),
    );
  }
}

图片