Monaco Editor

This version is still a v0, it might have bugs

Currently only supporting web, this plugin is a wrapper around the Monaco Editor, a browser-based code editor.

Features

  • Supported functions
    • setText
    • getText
    • onTextChanged
  • Supported theme
    • vs
    • vs-dark
    • hc-light
    • hc-black
  • Supported languages
    • plaintext
    • javascript
    • json
    • typescript
    • html
    • css
    • scss
    • python
    • php
    • java
    • c
    • cpp
    • csharp
    • shell
    • powershell
    • dockerfile
    • markdown
    • xml
    • yaml
    • sql
    • go
    • ruby
    • swift
    • lua
    • rust
    • kotlin
    • perl
    • objectivec
    • r
    • fsharp
    • groovy
    • bat
    • coffeescript
    • handlebars
    • jade
    • pug
    • razor
    • scheme
    • twig
    • vb
    • vbnet
    • vue
    • yaml
    • plaintext
    • dart
    • yaml
    • clojure
    • elm
    • haxe
    • ocaml
    • perl6
    • racket
    • reason
    • red
    • scheme
    • shell
    • tcl
    • verilog
    • vhdl
    • wollok
    • eiffel
    • erlang
    • fortran
    • julia
    • makefile
    • matlab
    • powershell
    • r
    • restructuredtext
    • sas
    • smalltalk
    • stata
    • twig
    • tsx
    • vbscript
    • xml
    • yaml

Example

class MyScreen extends StatefulWidget {
  const MyScreen({super.key});

  @override
  State<MyScreen> createState() => _MyScreenState();
}

class _MyScreenState extends State<MyScreen> {
  final controller = MonacoEditorController();

  @override
  void initState() {
    controller.initialize(
      MonacoEditorOptions(
        language: MonacoLanguage.json,
        theme: MonacoTheme.vsDark,
      ),
    );
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        floatingActionButton: FloatingActionButton(
          onPressed: () async {
            print(await controller.getText());
          },
          child: const Icon(Icons.add),
        ),
        body: MonacoEditorWidget(
            controller: controller,
          ),
        ),
      ),
    );
  }
}

Libraries

monaco_editor