Markdown Avalonia

https://github.com/whistyun/markdown.avalonia
Admin
Markdown.Avalonia is a port of MdXaml for Avalonia UI that allows rendering Markdown content within...
Tokens:59,378
Snippets:373
Trust Score:6.7
License:MIT
Update:3 weeks ago
Show doc for...
Tokens:
Raw
### Text alignment examples

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Shows how to align paragraphs using textile-style prefixes: 'p<.' for left, 'p>.' for right, 'p=.' for center, and 'p=>.' for ignored inner paragraph. Place the prefix at the start of the paragraph.

```txt
p<. arrange paragraph left-side.

p>. arrange paragraph right-side.

p=. arrange paragraph center.  
p=>. inner paragraph is ignored.

```

--------------------------------

### Note syntax example

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Demonstrates the proprietary note syntax using `< notetext >` and `<p>. notetext` delimiters. The output is shown in the generated image.

```txt
< notetext >

some text

<p>. notetext
```

--------------------------------

### C code block example

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.CTxt/Texts/MainWindow.md

Shows a C code block rendered by MdXaml. The example prints "Hello, World!" using printf and returns 0.

```c
```c
#include <stdio.h>
int main()
{
   // printf() displays the string inside quotation
   printf("Hello, World!");
   return 0;
}
```
```

--------------------------------

### Markdown list example

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-List

A simple markdown list with two items, used to demonstrate the effect of the custom styles.

```markdown
list example

* listitem1
* listitem2
```

--------------------------------

### C#: Custom MyLinkCommand class

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-linkaction

Implements ICommand to handle hyperlink clicks. The parameter is the URL string from the markdown; the example redirects to 'http://example.com' while preserving relative or absolute paths.

```csharp
public class MyLinkCommand : ICommand
{
	public event EventHandler CanExecuteChanged;

	public bool CanExecute(object parameter) => true;

    // parameter is only string.
    // The url described in markdown is passed to parameter as it is.
    // relative path remains relative path, absolute path remain absolute path.
	public void Execute(object parameter)
	{
		var urlTxt = (string)parameter;

		Markdown.Avalonia.Utils.DefaultHyperlinkCommand.GoTo("http://example.com");
	}
}
```

--------------------------------

### Table colspan and rowspan example

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Demonstrates the extended table syntax for colspan and rowspan, using the format \2. for column span, /3\2. for row and column span, /2. for row span, and <., =., >. for alignment.

```txt
| column1     | column2       | column4       | column5  |
|-------------|---------------|---------------|----------|
|\2. colspan2                 |/3\2. row3&col2           |
|/2. rowspan2 |<. left-algn   |
              |=. center-algn |
| hoge        |>. right-align | hoge          | hoge     |
```

--------------------------------

### C code block example

Source: https://github.com/whistyun/markdown.avalonia/blob/master/demos/Markdown.AvaloniaFluentAvaloniaDemo/MainWindow.md

A C code block showing a simple Hello World program. This is used to demonstrate block code support in Markdown.Xaml.

```c
#include <stdio.h>
int main()
{
   // printf() displays the string inside quotation
   printf("Hello, World!");
   return 0;
}
```

--------------------------------

### Markdown example with inline code and C code block

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-CCode

Markdown example showing inline code with backticks and a fenced C code block. The C code block is displayed using TextBlock.CodeBlock, while the inline code uses CCode.

```markdown
inline code: `this is inline.`

```c
#include <stdio.h>
int main()
{
   // printf() displays the string inside quotation
   printf("Hello, World!");
   return 0;
}
```
```

--------------------------------

### Markdown Blockquote Example

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-Blockquote

Example Markdown content that renders as a blockquote, including a heading, text, and list items.

```markdown
> ## heading in blockquote
> some tex in blockquote
> * listitem1
> * listitem2
```

--------------------------------

### Create container block handlers in C#

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Shows how to create custom container block handlers by implementing IContainerBlockHandler. Two example handlers are provided: MyBlockHandler1 returns a Border with a Button, and MyBlockHandler2 returns a Border with a TextBox.

```cs
using Markdown.Avalonia.Utils;
class MyBlockHandler1 : IContainerBlockHandler
{
    public Border ProvideControl(string assetPathRoot, string blockName, string lines)
    {
        return new Border()
        {
            Child = new Button()
            {
                Content = $"MyBlockHandler1[{blockName}]\nlines[{lines}]"
            }
        };
    }
}

class MyBlockHandler2 : IContainerBlockHandler
{
    public Border ProvideControl(string assetPathRoot, string blockName, string lines)
    {
        return new Border()
        {
            Child = new TextBox()
            {
                Text = $"MyBlockHandler2[{blockName}]\nlines[{lines}]"
            }
        };
    }
}
```

--------------------------------

### List styles examples

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Demonstrates proprietary list styles: lowercase and uppercase alphabet (a., A.) and lowercase and uppercase roman numerals (i, I). Use these markers to create ordered lists with those numbering schemes.

```txt
#### alphabet-ol (Proprietary adaptations)
a. one
b. two

#### alphabet-ol (Proprietary adaptations)
A. one
B. two

#### roman-ol (Proprietary adaptations)
i, one
ii, two

#### roman-ol (Proprietary adaptations)
I, one
II, two

```

--------------------------------

### Viewmodel for binding markdown with ReactiveUI

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use

Provides the viewmodel used in the binding example. Implements INotifyPropertyChanged via ReactiveUI's ReactiveObject to support dynamic updates to the MdText property.

```csharp
using ReactiveUI;

namespace HowToUse
{
    public class UseBindingViewModel : ReactiveObject
    {
        private string _MdText;
        public string MdText
        {
            get => _MdText;
            set => this.RaiseAndSetIfChanged(ref _MdText, value);
        }
    }
}
```

--------------------------------

### Table linebreak example

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Shows how newlines (\n) inside table cells are rendered as linebreaks by default, and how to escape them with a double backslash (\\n) to prevent the linebreak.

```txt
| column1\nwith linebreak     | column2       |
|-----------------------------|---------------|
| text\nwith\nlinebreak       | text\\nnobreak|
```

--------------------------------

### Markdown header syntax

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-Headers

Shows the Markdown syntax for creating headers from level 1 to level 6, which correspond to the Heading1 through Heading6 styles defined in the XAML example.

```markdown
# Heading1
## Heading2
### Heading3
#### Heading4
##### Heading5
###### Heading6
```

--------------------------------

### Markdown table example

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-Table

A sample markdown table with two columns and four rows, used to demonstrate the custom table styles. The table includes header, odd, and even rows.

```markdown
|  column1   |  column2   |
|------------|------------|
| odd  cell1 | odd  cell2 |
| even cell1 | even cell2 |
| odd  cell1 | odd  cell2 |
| even cell1 | even cell2 |
```

--------------------------------

### Horizontal rule syntax examples

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Shows the four horizontal rule syntaxes supported by Markdown.Avalonia: `---`, `===`, `***`, and `___`. The first three are standard, but Markdown.Avalonia renders them with different looks.

```txt
single line
 ---
two lines
 ===
bold line
 ***
bold with single
___
```

--------------------------------

### Custom BitmapLoader for Markdown.Avalonia (XAML + C#)

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-loder

Shows how to set a custom IBitmapLoader on the Markdown engine in XAML and implement the loader in C#. The XAML defines a MyBitmapLoader resource and assigns it to the BitmapLoader property. The C# class implements IBitmapLoader with an AssetPathRoot property and a Get method that returns null to indicate load failure.

```xml
<!-- xmlns:md="clr-namespace:Markdown.Avalonia;assembly=Markdown.Avalonia" -->

<Window.Resources>
    <local:MyBitmapLoader x:Key="myImageLoader"/>
</Window.Resources>

...

<md:MarkdownScrollViewer>
    <md:MarkdownScrollViewer.Engine>
        <md:Markdown
            BitmapLoader="{StaticResource myImageLoader}"
            />
    </md:MarkdownScrollViewer.Engine>
</md:MarkdownScrollViewer>
```

```csharp
// using Markdown.Avalonia.Utils;

public class MyBitmapLoader : IBitmapLoader
{
    // local file root path, the default is current directory.
	public string AssetPathRoot { set; private get; }

    // The url of the image described in markdown is passed to urlTxt as it is.
    // relative path remains relative path, absolute path remain absolute path.
	public Bitmap Get(string urlTxt)
	{
		// load any image.
		// If you return null, Markdown.Avalonia considers it a load failure
		// and displays an alternative error image.
		return null;
	}
}
```

--------------------------------

### Markdown example with inline code and fenced code blocks

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-Code

Shows a markdown document with inline code and two fenced code blocks. The first fenced block has no language specified, the second uses 'c' for C syntax highlighting. The code blocks contain a simple C program that prints 'Hello, World!'.

```markdown
inline code: `this is inline.`

```
#include <stdio.h>
int main()
{
    // printf() displays the string inside quotation
    printf("Hello, World!");
    return 0;
}
```
---

```c
#include <stdio.h>
int main()
{
    // printf() displays the string inside quotation
    printf("Hello, World!");
    return 0;
}
```
```

--------------------------------

### Customize MarkdownScrollViewer styles with Style selectors

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style

Shows how to apply custom styles to markdown-rendered elements by setting the `MarkdownScrollViewer.Styles` property. The example targets `CTextBlock.Heading1` with a foreground and background, and a nested selector for headings inside blockquotes. Requires the `Markdown.Avalonia` and `ColorTextBlock.Avalonia` namespaces.

```xml
<!--
    xmlns:md="clr-namespace:Markdown.Avalonia;assembly=Markdown.Avalonia"
    xmlns:ctxt="clr-namespace:ColorTextBlock.Avalonia;assembly=ColorTextBlock.Avalonia"
-->

<md:MarkdownScrollViewer>
    <md:MarkdownScrollViewer.Styles>
        <Style Selector="ctxt|CTextBlock.Heading1">
            <Setter Property="Foreground" Value="AliceBlue"/>
            <Setter Property="Background" Value="DarkBlue"/>
        </Style>

        <Style Selector=".Blockquote ctxt|CTextBlock.Heading1">
            <Setter Property="FontSize" Value="13"/>
        </Style>
    </md:MarkdownScrollViewer.Styles>

    # Heading1

    ## Heading2

    The quick brown fox jumps over the lazy dog.

    > #blockquote
    > p>. and enhance syntax
</md:MarkdownScrollViewer>
```

--------------------------------

### XAML Styles Template with Namespace Declarations

Source: https://github.com/whistyun/markdown.avalonia/blob/master/demos/Markdown.AvaloniaFluentAvaloniaDemo/Assets/XamlTemplate.txt

Defines a XAML Styles root element with namespace mappings for Avalonia, Markdown.Avalonia controls, and ColorTextBlock.Avalonia. Use as a starting point for styling Markdown.Avalonia controls in an Avalonia application.

```xml
<Styles
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mdc="clr-namespace:Markdown.Avalonia.Controls;assembly=Markdown.Avalonia"
    xmlns:ctxt="clr-namespace:ColorTextBlock.Avalonia;assembly=ColorTextBlock.Avalonia">




</Styles>
```

--------------------------------

### C# Hello World

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Texts/ContainerBlock.md

A simple Main method that prints ':Hello World:' using Console.WriteLine.

```cs
public void Main(){
    Console.WriteLine(":Hello World:");
}
```

```cs
public void Main(){
    Console.WriteLine(":Hello World:");
}
```

```cs
public void Main(){
    Console.WriteLine(":Hello World:");
}
```

```cs
public void Main(){
    Console.WriteLine(":Hello World:");
}
```

--------------------------------

### C# Hello World with cs Language Hint

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Texts/ContainerBlock.md

A Main method with an explicit language hint, printing the same string.

```cs
public void Main(){
    Console.WriteLine(":Hello World:");
}
```

--------------------------------

### csproj for Markdown.Avalonia.Tight

Source: https://github.com/whistyun/markdown.avalonia/wiki/migrates/How-to-migrages-to-ver11

Add the Markdown.Avalonia.Tight package reference to the project file.

```xml
<ItemGroup>
   <PackageReference Include="Markdown.Avalonia.Tight" Version="$(version)" />
</ItemGroup>
```

--------------------------------

### Avalonia Markdown Rule and Table Header

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Out/UnitTestMd.Transform_givenTables1_generatesExpectedResult.approved.txt

Demonstrates a horizontal rule element and the start of a secondary table structure.

```xml
  <ma2:Rule BoldLineWidth="2" Classes="Single" />
  <Border Classes="Table" xmlns="">
    <Border.Child>
      <Grid Classes="Table">
        <Border Classes="TableHeader" Grid.Column="0" Grid.Row="0">
          <Border.Child>
            <c:CTextBlock>
              <c:CRun Text="a" />
              <c:CLineBreak Text="&#xA;" />
              <c:CRun Text="b" />
            </c:CTextBlock>
          </Border.Child>
        </Border>
        <Border Classes="TableHeader" Grid.Column="1" Grid.Row="0" />
        <Border Classes="OddTableRow,FirstTableRow" Grid.Column="0" Grid.Row="1">
          <Border.Child>
            <c:CTextBlock>
              <c:CRun Text="alpha" />
            </c:CTextBlock>
          </Border.Child>
        </Border>
        <Border Classes="OddTableRow,FirstTableRow" Grid.Column="1" Grid.Row="1" />
        <Border Classes="EvenTableRow" Grid.Column="0" Grid.Row="2">
          <Border.Child>
            <c:CTextBlock>
              <c:CRun Text="be" />
              <c:CLineBreak Text="&#xA;" />
              <c:CRun Text="ta" />
            </c:CTextBlock>
          </Border.Child>
        </Border>
        <Border Classes="EvenTableRow" Grid.Column="1" Grid.Row="2">
          <Border.Child>
            <c:CTextBlock>
              <c:CRun Text="gamma" />
```

--------------------------------

### Table span escape example

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Shows how to prevent span parsing by placing a space after the pipe (|) before the backslash, so the text is treated literally.

```txt
| column1     | column2       |
|-------------|---------------|
|\2. parse as column span     |
| \2. ignore  | hoge          |
```

--------------------------------

### csproj for Markdown.Avalonia

Source: https://github.com/whistyun/markdown.avalonia/wiki/migrates/How-to-migrages-to-ver11

Add the Markdown.Avalonia package reference to the project file.

```xml
<ItemGroup>
   <PackageReference Include="Markdown.Avalonia" Version="$(version)" />
</ItemGroup>
```

--------------------------------

### Empty C# Method

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Texts/ContainerBlock.md

A Main method with no body content, only whitespace.

```cs
public void Main(){







  
}
```

```cs
public void Main(){







  
}
```

```cs
public void Main(){







  
}
```

--------------------------------

### Java Hello World Program

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.MdHtml/Texts/CodeBlock.html

A simple Java program that prints 'Hello' to the console. It imports java.lang.* and defines a main method.

```java
import java.lang.*;
public class Program {
    public static void main(String[] args) {
        System.out.println("Hello");
    }    
}
```

--------------------------------

### Include markdown as AvaloniaResource in .csproj

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use

Adds the file 'MdTxt/Test.md' to the project as an AvaloniaResource so it can be referenced by URI.

```xml
  <ItemGroup>
    <AvaloniaResource Include="MdTxt\Test.md" />
  </ItemGroup>
```

--------------------------------

### C# Hello World with backticks

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.MdSyntax/Texts/Codes.md

A simple C# code block that prints a string with backticks.

```csharp
public void Main(){
    Console.WriteLine("`Hello World`");
}

```

--------------------------------

### Markdown usage of styled hyperlinks

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-Hyperlink

Markdown examples showing how to use the styled hyperlinks. The first link uses default styling, the second uses the 'green' class via the title attribute.

```markdown

[hyperlinki1](http://example.com)

[hyperlinki1](http://example.com "green")

```

--------------------------------

### XAML list with nested bullet sublist using paragraphs

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Out/UnitTestMd.Transform_givenLists1_generatesExpectedResult.approved.txt

XAML layout for a numbered list with a nested bulleted sublist, where each item is wrapped in a Paragraph. The structure mirrors the previous example but uses Paragraph classes for all text blocks. The outer Grid uses Classes="List" and two columns; the nested sublist uses bullet markers (•) and its own column/row definitions.

```xml
<c:CTextBlock Classes="Paragraph">
  <c:CRun Text="Same thing but with paragraphs:" />
</c:CTextBlock>
<Grid Classes="List" xmlns="">
  <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="0">
    <c:CRun Text="1." />
  </c:CTextBlock>
  <StackPanel Grid.Column="1" Grid.Row="0">
    <c:CTextBlock Classes="Paragraph">
      <c:CRun Text="First" />
    </c:CTextBlock>
  </StackPanel>
  <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="1">
    <c:CRun Text="2." />
  </c:CTextBlock>
  <StackPanel Grid.Column="1" Grid.Row="1">
    <c:CTextBlock Classes="Paragraph">
      <c:CRun Text="Second:" />
    </c:CTextBlock>
    <Grid Classes="List">
      <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="0">
        <c:CRun Text="•" />
      </c:CTextBlock>
      <StackPanel Grid.Column="1" Grid.Row="0">
        <c:CTextBlock Classes="Paragraph">
          <c:CRun Text="Fee" />
        </c:CTextBlock>
      </StackPanel>
      <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="1">
        <c:CRun Text="•" />
      </c:CTextBlock>
      <StackPanel Grid.Column="1" Grid.Row="1">
        <c:CTextBlock Classes="Paragraph">
          <c:CRun Text="Fie" />
        </c:CTextBlock>
      </StackPanel>
      <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="2">
        <c:CRun Text="•" />
      </c:CTextBlock>
      <StackPanel Grid.Column="1" Grid.Row="2">
        <c:CTextBlock Classes="Paragraph">
          <c:CRun Text="Foe" />
        </c:CTextBlock>
      </StackPanel>
      <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
      </Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
      </Grid.RowDefinitions>
    </Grid>
  </StackPanel>
  <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="2">
    <c:CRun Text="3." />
  </c:CTextBlock>
  <StackPanel Grid.Column="1" Grid.Row="2">
    <c:CTextBlock Classes="Paragraph">
      <c:CRun Text="Third" />
    </c:CTextBlock>
  </StackPanel>
  <Grid.ColumnDefinitions>
    <ColumnDefinition />
    <ColumnDefinition />
  </Grid.ColumnDefinitions>
  <Grid.RowDefinitions>
    <RowDefinition />
    <RowDefinition />
    <RowDefinition />
  </Grid.RowDefinitions>
</Grid>
```

--------------------------------

### XAML output for unordered list rendering

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Out/UnitTestMd.Transform_givenLists2_generatesExpectedResult.approved.txt

Shows the expected XAML structure for a simple unordered markdown list with items Han, Leia, Luke, Obiwan. Uses bullet markers and Grid layout.

```xml
<StackPanel xmlns:c="clr-namespace:ColorTextBlock.Avalonia;assembly=ColorTextBlock.Avalonia" xmlns:m="https://github.com/whistyun/Markdown.Avalonia.Tight" xmlns:ma="https://github.com/whistyun/Markdown.Avalonia.Tight/Styles" xmlns:ma2="clr-namespace:Markdown.Avalonia.Controls;assembly=Markdown.Avalonia" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns="https://github.com/avaloniaui">
  <c:CTextBlock Classes="Paragraph">
    <c:CRun Text="Then we have a simple unordered list" />
  </c:CTextBlock>
  <Grid Classes="List" xmlns="">
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="0">
      <c:CRun Text="•" />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="0">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Han" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="1">
      <c:CRun Text="•" />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="1">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Leia" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="2">
      <c:CRun Text="•" />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="2">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Luke" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="3">
      <c:CRun Text="•" />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="3">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Obiwan" />
      </c:CTextBlock>
    </StackPanel>
    <Grid.ColumnDefinitions>
      <ColumnDefinition />
      <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
      <RowDefinition />
      <RowDefinition />
      <RowDefinition />
      <RowDefinition />
    </Grid.RowDefinitions>
  </Grid>
</StackPanel>
```

--------------------------------

### IBitmapLoader

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-loder

Describes the IBitmapLoader interface and its implementation.

```APIDOC
## [Interface] IBitmapLoader

### Description
Interface for custom bitmap loading. Implement this interface to control how images are loaded from URLs in Markdown content.

### Members
- **AssetPathRoot** (string) - Setter - The local file root path, default is current directory.
- **Get(string urlTxt)** (Bitmap) - Returns the loaded bitmap. The URL from the Markdown is passed as-is. Return null to indicate load failure, which displays an alternative error image.

### Implementation Example
```cs
public class MyBitmapLoader : IBitmapLoader
{
    public string AssetPathRoot { set; private get; }

    public Bitmap Get(string urlTxt)
    {
        // load any image.
        // If you return null, Markdown.Avalonia considers it a load failure
        // and displays an alternative error image.
        return null;
    }
}
```
```

--------------------------------

### ViewModel properties and OpenFile method

Source: https://github.com/whistyun/markdown.avalonia/wiki/Image-loading-priority

C# ViewModel with Text and RootDir properties and an OpenFile method that sets them from a file path. This is used together with the XAML view to load images from the correct directory.

```csharp
    public string Text { ... }
    public string RootDir { ... }

    public void OpenFile(string filepath){
        Text = File.ReadAllText(filepath);
        RootDir = Path.GetDirectoryName(filepath);
    }
```

--------------------------------

### XAML output for tight asterisk unordered list

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Out/UnitTestMd.Transform_givenLists2_generatesExpectedResult.approved.txt

Shows the expected XAML for a tight unordered list using asterisks, with items asterisk 1, asterisk 2, asterisk 3.

```xml
<StackPanel xmlns:c="clr-namespace:ColorTextBlock.Avalonia;assembly=ColorTextBlock.Avalonia" xmlns:m="https://github.com/whistyun/Markdown.Avalonia.Tight" xmlns:ma="https://github.com/whistyun/Markdown.Avalonia.Tight/Styles" xmlns:ma2="clr-namespace:Markdown.Avalonia.Controls;assembly=Markdown.Avalonia" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns="https://github.com/avaloniaui">
  <c:CTextBlock Classes="Heading2">
    <c:CRun Text="Unordered" />
  </c:CTextBlock>
  <c:CTextBlock Classes="Paragraph">
    <c:CRun Text="Asterisks tight:" />
  </c:CTextBlock>
  <Grid Classes="List" xmlns="">
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="0">
      <c:CRun Text="•" />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="0">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="asterisk 1" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="1">
      <c:CRun Text="•" />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="1">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="asterisk 2" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="2">
      <c:CRun Text="•" />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="2">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="asterisk 3" />
      </c:CTextBlock>
    </StackPanel>
    <Grid.ColumnDefinitions>
      <ColumnDefinition />
      <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
      <RowDefinition />
      <RowDefinition />
      <RowDefinition />
    </Grid.RowDefinitions>
  </Grid>
</StackPanel>
```

--------------------------------

### Configure ChatAISetup plugin in XAML

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use-Enhanched-syntax

Add the ChatAISetup plugin to a MarkdownScrollViewer's Plugins collection to enable ChatAI mode, which disables some enhanced syntax and enables code pre-rendering. The XML comments show the required XML namespaces for Markdown.Avalonia and Markdown.Avalonia.Tight.

```xml
<!-- 
  xmlns:md=
    "https://github.com/whistyun/Markdown.Avalonia"
    or
    "https://github.com/whistyun/Markdown.Avalonia.Tight"

  xmlns:mdt=
    "https://github.com/whistyun/Markdown.Avalonia.Tight"
-->

<md:MarkdownScrollViewer>
  <md:MarkdownScrollViewer.Plugins>
    <md:MdAvPlugins>
      <mdt:ChatAISetup/>
    </md:MdAvPlugins>
  </md:MarkdownScrollViewer.Plugins>
</md:MarkdownScrollViewer>
```

--------------------------------

### Load .md from AvaloniaResource

Source: https://github.com/whistyun/markdown.avalonia/blob/master/pack_readme/Markdown.Avalonia.md

Loads a Markdown file from an AvaloniaResource using the Source property. Replace YourAssemblyName and the path with your actual assembly and file location.

```xml
<md:MarkdownScrollViewer
   Source="avares://YourAssemblyName/Assets/Test.md"/>
```

--------------------------------

### Add SimpleTheme or FluentTheme to App.xaml

Source: https://github.com/whistyun/markdown.avalonia/wiki/Setup-AvaloniaEdit-for-syntax-hightlighting

Add SimpleTheme or FluentTheme to App.xaml to ensure AvaloniaEdit styles are available for syntax highlighting. This is required if the application doesn't already use one of these themes.

```xml
<Application xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:Markdown.AvaloniaFluentAvaloniaDemo"
             xmlns:sty="using:FluentAvalonia.Styling"
             x:Class="Markdown.AvaloniaFluentAvaloniaDemo.App">
  <Application.Styles>
    <SimpleTheme />
    <sty:FluentAvaloniaTheme />
    <StyleInclude Source="/Assets/AppendingStyles.axaml"/>
  </Application.Styles>
</Application>
```

--------------------------------

### xaml for Markdown.Avalonia.Tight

Source: https://github.com/whistyun/markdown.avalonia/wiki/migrates/How-to-migrages-to-ver11

Declare the XML namespace for Markdown.Avalonia.Tight in XAML.

```xml
<Window xmlns="https://github.com/avaloniaui"

        xmlns:md="https://github.com/whistyun/Markdown.Avalonia.Tight"
        >
        ...
</Window>
```

--------------------------------

### Load markdown from an AvaloniaResource with Source property

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-use

Uses the Source property of MarkdownScrollViewer to point to a markdown file packaged as an AvaloniaResource. The URI uses 'avares://' followed by the assembly name and file path.

```xml
<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:md="https://github.com/whistyun/Markdown.Avalonia"
             x:Class="HowToUse.WriteMarkdownInXaml">

  <md:MarkdownScrollViewer
      Source="avares://YourAssemblyName/MdTxt/Test.md"/>

</UserControl>
```

--------------------------------

### Avalonia XAML layout for a list with items a. to q.

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Out/UnitTestMd.Transform_givenLists3_generatesExpectedResult.approved.txt

This XAML snippet shows the expected Avalonia UI layout for a Markdown list with 17 items. It uses a StackPanel with a CTextBlock for the 'alphabet:' heading and a Grid with ListMarker CTextBlocks and StackPanels for each list item. The Grid uses Classes="List" and each item has a marker (e.g., 'a.') and a paragraph with 'foobar'.

```xml
<?xml version="1.0" encoding="utf-16"?>
<StackPanel xmlns:c="clr-namespace:ColorTextBlock.Avalonia;assembly=ColorTextBlock.Avalonia" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns="https://github.com/avaloniaui">
  <c:CTextBlock Classes="Paragraph">
    <c:CRun Text="alphabet: " />
  </c:CTextBlock>
  <Grid Classes="List" xmlns="">
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="0">
      <c:CRun Text="a." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="0">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="1">
      <c:CRun Text="b." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="1">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="2">
      <c:CRun Text="c." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="2">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="3">
      <c:CRun Text="d." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="3">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="4">
      <c:CRun Text="e." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="4">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="5">
      <c:CRun Text="f." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="5">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="6">
      <c:CRun Text="g." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="6">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="7">
      <c:CRun Text="h." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="7">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="8">
      <c:CRun Text="i." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="8">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="9">
      <c:CRun Text="j." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="9">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="10">
      <c:CRun Text="k." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="10">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="11">
      <c:CRun Text="l." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="11">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="12">
      <c:CRun Text="m." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="12">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="13">
      <c:CRun Text="n." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="13">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="14">
      <c:CRun Text="o." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="14">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="15">
      <c:CRun Text="p." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="15">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="16">
      <c:CRun Text="q." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="16">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="foobar" />
      </c:CTextBlock>
    </StackPanel>
  </Grid>
</StackPanel>
```

--------------------------------

### Markdown usage of image classes

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-style-Image

Shows how to use the defined classes by setting the title attribute in markdown image syntax.

```markdown
![](https://www.nuget.org/profiles/whistyun/avatar)
![](https://www.nuget.org/profiles/whistyun/avatar "Tall")
![](https://www.nuget.org/profiles/whistyun/avatar "Wide")
![](https://www.nuget.org/profiles/whistyun/avatar "Small")
```

--------------------------------

### Implement IPathResolver in C# to restrict image paths

Source: https://github.com/whistyun/markdown.avalonia/wiki/How-to-customise-imagepath-resolving

This C# class implements IPathResolver to allow only absolute paths and restrict internet images. It throws NotImplementedException for relative paths and InvalidDataException for unsupported schemes. It supports file and avares schemes, returning null if the file or asset does not exist.

```csharp
class MyPathResolver: IPathResolver
{
    public string? AssetPathRoot { set; private get; }
    public IEnumerable<string>? CallerAssemblyNames { set; private get; }

    public async Task<Stream?>? ResolveImageResource(string relativeOrAbsolutePath)
    {
        if (Uri.TryCreate(relativeOrAbsolutePath, UriKind.Absolute, out var aburl))
        {
            return await OpenStream(aburl);
        }

        throw new NotImplementedException();
    }

    private async Task<Stream?> OpenStream(Uri url)
    {
        switch (url.Scheme)
        {
            case "file":
                if (!File.Exists(url.LocalPath)) return null;
                return File.OpenRead(url.LocalPath);

            case "avares":
                if (!AssetLoader.Exists(url))
                    return null;

                return AssetLoader.Open(url);

            default:
                throw new InvalidDataException($"unsupport scheme '{url.Scheme}'");
        }
    }
}
```

--------------------------------

### Ordered list with spaces rendered as XAML Grid

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Out/UnitTestMd.Transform_givenLists1_generatesExpectedResult.approved.txt

XAML output for an ordered list using spaces, with list markers and paragraph text in a Grid layout.

```xml
<Grid Classes="List" xmlns="">
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="0">
      <c:CRun Text="1." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="0">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="One" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="1">
      <c:CRun Text="2." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="1">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Two" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="2">
      <c:CRun Text="3." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="2">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Three" />
      </c:CTextBlock>
    </StackPanel>
    <Grid.ColumnDefinitions>
      <ColumnDefinition />
      <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
      <RowDefinition />
      <RowDefinition />
      <RowDefinition />
    </Grid.RowDefinitions>
  </Grid>
```

--------------------------------

### #define FooBar

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Texts/ContainerBlock.md

A preprocessor directive defined inside a fenced code block.

```cs
#define FooBar
```

--------------------------------

### XAML output for numeric list rendering

Source: https://github.com/whistyun/markdown.avalonia/blob/master/tests/UnitTest.Md/Out/UnitTestMd.Transform_givenLists2_generatesExpectedResult.approved.txt

Shows the expected XAML structure for a numeric markdown list with items Alpha, Beta, Gamma, Delta. Uses CTextBlock for text and Grid for list layout.

```xml
<StackPanel xmlns:c="clr-namespace:ColorTextBlock.Avalonia;assembly=ColorTextBlock.Avalonia" xmlns:m="https://github.com/whistyun/Markdown.Avalonia.Tight" xmlns:ma="https://github.com/whistyun/Markdown.Avalonia.Tight/Styles" xmlns:ma2="clr-namespace:Markdown.Avalonia.Controls;assembly=Markdown.Avalonia" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns="https://github.com/avaloniaui">
  <c:CTextBlock Classes="Paragraph">
    <c:CRun Text="First we have a simple numeric list" />
  </c:CTextBlock>
  <Grid Classes="List" xmlns="">
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="0">
      <c:CRun Text="1." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="0">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Alpha" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="1">
      <c:CRun Text="2." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="1">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Beta" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="2">
      <c:CRun Text="3." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="2">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Gamma" />
      </c:CTextBlock>
    </StackPanel>
    <c:CTextBlock Classes="ListMarker" Grid.Column="0" Grid.Row="3">
      <c:CRun Text="4." />
    </c:CTextBlock>
    <StackPanel Grid.Column="1" Grid.Row="3">
      <c:CTextBlock Classes="Paragraph">
        <c:CRun Text="Delta" />
      </c:CTextBlock>
    </StackPanel>
    <Grid.ColumnDefinitions>
      <ColumnDefinition />
      <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
      <RowDefinition />
      <RowDefinition />
      <RowDefinition />
      <RowDefinition />
    </Grid.RowDefinitions>
  </Grid>
</StackPanel>
```
Tokens:
Raw