Richasy.Controls.MarkdownEditBox 1.0.7

Markdown editor based on monaco-editor and WebView

Install-Package Richasy.Controls.MarkdownEditBox -Version 1.0.7
dotnet add package Richasy.Controls.MarkdownEditBox --version 1.0.7
<PackageReference Include="Richasy.Controls.MarkdownEditBox" Version="1.0.7" />
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add Richasy.Controls.MarkdownEditBox --version 1.0.7
The NuGet Team does not provide support for this client. Please contact its maintainers for support.
#r "nuget: Richasy.Controls.MarkdownEditBox, 1.0.7"
#r directive can be used in F# Interactive, C# scripting and .NET Interactive. Copy this into the interactive tool or source code of the script to reference the package.
// Install Richasy.Controls.MarkdownEditBox as a Cake Addin
#addin nuget:?package=Richasy.Controls.MarkdownEditBox&version=1.0.7

// Install Richasy.Controls.MarkdownEditBox as a Cake Tool
#tool nuget:?package=Richasy.Controls.MarkdownEditBox&version=1.0.7
The NuGet Team does not provide support for this client. Please contact its maintainers for support.

This is not a lightweight Markdown editor, in fact, it is very heavy, and there is no performance at all.

The editor is based on monaco-editor and is presented using WebView in UWP.

  • It provides syntax highlighting for classic syntax and most extended syntax (such as strikethrough, supscripts and subscripts)
  • Provides a relatively rich custom interface for relatively deep interface customization
  • Through markdown-it, it can parse many markdown grammars including katex and plantuml, which can definitely meet the needs of mainstream usage
  • Perfect shortcut key definition

However, due to the Chakra kernel, the editor has some known issues:

  • Resize in Split mode will have a very obvious feeling of freeze.
  • After quickly switching applications, calling the input method will generate garbled characters
  • After selecting the text, use the input method to input text, the first time the input is invalid, the second time is normal.

This is a Markdown editor with the same obvious advantages and disadvantages. In fact, most of the shortcomings will be fixed after the official launch of WebView2 (because monaco-editor is designed for the core of Chromium), so this is actually a design for WebView2 Controls.

Simply usage

Xaml

<editor:MarkdownEditBox x:Name="MyEditor" Grid.Row="1"
                        IsLoadingRingActive="True"
                        LoadingRingForeground="{ThemeResource SystemColorControlAccentBrush}"
                        ControlLoaded="MyEditor_ControlLoaded"
                        />

Xaml.cs

private async void MyEditor_ControlLoaded(object sender, EventArgs e)
{
    var displayOptions = DisplayOptions.CreateOptions();
    var editorOptions = EditorOptions.CreateOptions();
    var localeOptions = await EditorLocaleOptions.GetDefaultEnOptionsAsync();

    editorOptions.Theme = "";

    await MyEditor.Initialize("# Hello Markdown!", displayOptions, editorOptions, "", localeOptions);

    var cssFile = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Assets/acrmd.css"));
    string css = await FileIO.ReadTextAsync(cssFile);
    await MyEditor.SetPreviewStyle(css);
}

This is not a lightweight Markdown editor, in fact, it is very heavy, and there is no performance at all.

The editor is based on monaco-editor and is presented using WebView in UWP.

  • It provides syntax highlighting for classic syntax and most extended syntax (such as strikethrough, supscripts and subscripts)
  • Provides a relatively rich custom interface for relatively deep interface customization
  • Through markdown-it, it can parse many markdown grammars including katex and plantuml, which can definitely meet the needs of mainstream usage
  • Perfect shortcut key definition

However, due to the Chakra kernel, the editor has some known issues:

  • Resize in Split mode will have a very obvious feeling of freeze.
  • After quickly switching applications, calling the input method will generate garbled characters
  • After selecting the text, use the input method to input text, the first time the input is invalid, the second time is normal.

This is a Markdown editor with the same obvious advantages and disadvantages. In fact, most of the shortcomings will be fixed after the official launch of WebView2 (because monaco-editor is designed for the core of Chromium), so this is actually a design for WebView2 Controls.

Simply usage

Xaml

<editor:MarkdownEditBox x:Name="MyEditor" Grid.Row="1"
                        IsLoadingRingActive="True"
                        LoadingRingForeground="{ThemeResource SystemColorControlAccentBrush}"
                        ControlLoaded="MyEditor_ControlLoaded"
                        />

Xaml.cs

private async void MyEditor_ControlLoaded(object sender, EventArgs e)
{
    var displayOptions = DisplayOptions.CreateOptions();
    var editorOptions = EditorOptions.CreateOptions();
    var localeOptions = await EditorLocaleOptions.GetDefaultEnOptionsAsync();

    editorOptions.Theme = "";

    await MyEditor.Initialize("# Hello Markdown!", displayOptions, editorOptions, "", localeOptions);

    var cssFile = await StorageFile.GetFileFromApplicationUriAsync(new Uri("ms-appx:///Assets/acrmd.css"));
    string css = await FileIO.ReadTextAsync(cssFile);
    await MyEditor.SetPreviewStyle(css);
}

Release Notes

Change method and property name about locale

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version History

Version Downloads Last updated
1.0.7 220 9/8/2020