inabox/InABox.DynamicGrid/Editors/RichTextEditor.xaml

<UserControl x:Class="InABox.DynamicGrid.RichTextEditor"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:sf="http://schemas.syncfusion.com/wpf"
             mc:Ignorable="d"
             d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.Resources>
        <sf:FontFamilyStringConverter x:Key="FontFamilyStringConverter" />
        <sf:UnderlineToggleConverter x:Key="UnderlineToggleConverter" />
        <sf:LeftAlignmentToggleConverter x:Key="LeftAlignmentToggleConverter" />
        <sf:RightAlignmentToggleConverter x:Key="RightAlignmentToggleConverter" />
        <sf:CenterAlignmentToggleConverter x:Key="CenterAlignmentToggleConverter" />
        <sf:JustifyAlignmentToggleConverter x:Key="JustifyAlignmentToggleConverter" />
    </UserControl.Resources>
    <Border BorderBrush="DarkGray" BorderThickness="0.75" CornerRadius="2">
        <DockPanel>

            <sf:ToolBarAdv x:Name="Toolbar" DockPanel.Dock="Top" Focusable="False" GripperVisibility="Collapsed"
                           IsOverflowOpen="False">
                <ComboBox Margin="12 2 0 2" Focusable="False" Width="160" x:Name="fontFamilyCombo"
                          SelectedValue="{Binding Path=Selection.CharacterFormat.FontFamily, Mode=TwoWay, ElementName=Editor, Converter={StaticResource FontFamilyStringConverter}}"
                          ItemsSource="{Binding Path=FontFamilySource}" />
                <ComboBox Margin="12 2 0 2" IsTabStop="False" Width="45" x:Name="fontSizeCombo" SelectedIndex="3"
                          ItemsSource="{Binding Path=FontSizeSource}"
                          SelectedValue="{Binding Path=Selection.CharacterFormat.FontSize ,Mode=TwoWay,ElementName=Editor}" />
                <sf:ColorPickerPalette x:Name="fontColorPicker" Margin="12 2 0 2" IsTabStop="False" Width="60"
                                       IsExpanded="False" MoreColorOptionVisibility="Collapsed"
                                       StandardPanelVisibility="Collapsed"
                                       Color="{Binding Path=Selection.CharacterFormat.FontColor ,Mode=TwoWay,ElementName=Editor}" />
                <sf:ButtonAdv x:Name="Bold" Margin="12 2 0 2" Focusable="False" SizeMode="Small" IsCheckable="True"
                              IsChecked="{Binding ElementName=Editor, Path=Selection.CharacterFormat.Bold, Mode=TwoWay}" />
                <sf:ButtonAdv x:Name="Italic" Margin="12 2 0 2" Focusable="False" SizeMode="Small" IsCheckable="True"
                              IsChecked="{Binding ElementName=Editor,Path=Selection.CharacterFormat.Italic,Mode=TwoWay}" />
                <sf:ButtonAdv x:Name="Underline" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              IsCheckable="True"
                              IsChecked="{Binding ElementName=Editor, Path=Selection.CharacterFormat.Underline, Mode=TwoWay, Converter={StaticResource UnderlineToggleConverter}}" />
                <sf:ToolBarItemSeparator Margin="12 2 0 2" />
                <sf:ButtonAdv x:Name="AlignLeft" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              IsCheckable="True"
                              IsChecked="{Binding ElementName=Editor, Path=Selection.ParagraphFormat.TextAlignment, Converter={StaticResource LeftAlignmentToggleConverter}, Mode=TwoWay}" />
                <sf:ButtonAdv x:Name="AlignCentre" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              IsCheckable="True"
                              IsChecked="{Binding ElementName=Editor, Path=Selection.ParagraphFormat.TextAlignment, Converter={StaticResource CenterAlignmentToggleConverter}, Mode=TwoWay}" />
                <sf:ButtonAdv x:Name="AlignRight" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              IsCheckable="True"
                              IsChecked="{Binding ElementName=Editor, Path=Selection.ParagraphFormat.TextAlignment, Converter={StaticResource RightAlignmentToggleConverter}, Mode=TwoWay}" />
                <sf:ButtonAdv x:Name="AlignJustify" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              IsCheckable="True"
                              IsChecked="{Binding ElementName=Editor, Path=Selection.ParagraphFormat.TextAlignment, Converter={StaticResource JustifyAlignmentToggleConverter}, Mode=TwoWay}" />
                <sf:ToolBarItemSeparator Margin="12 2 0 2" />
                <sf:ButtonAdv x:Name="Hyperlink" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              Command="sf:SfRichTextBoxAdv.ShowHyperlinkDialogCommand"
                              CommandTarget="{Binding ElementName=Editor}" />
                <sf:ButtonAdv x:Name="Picture" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              Command="sf:SfRichTextBoxAdv.InsertPictureCommand"
                              CommandTarget="{Binding ElementName=Editor}" />
                <sf:ButtonAdv x:Name="Table" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              Command="sf:SfRichTextBoxAdv.ShowInsertTableDialogCommand"
                              CommandTarget="{Binding ElementName=Editor}" />
                <sf:ToolBarItemSeparator Margin="12 2 0 2" />
                <sf:ButtonAdv x:Name="ZoomIn" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              SmallIcon="pack://application:,,,/Resources/zoomin.png" Click="ZoomIn_Click" />
                <sf:ButtonAdv x:Name="ZoomOut" Margin="12 2 0 2" Focusable="False" SizeMode="Small"
                              SmallIcon="pack://application:,,,/Resources/zoomout.png" Click="ZoomOut_Click" />
            </sf:ToolBarAdv>

            <sf:SfRichTextBoxAdv x:Name="Editor" DockPanel.Dock="Top" EnableMiniToolBar="False"
                                 ContentChanged="RichTextBoxAdv_ContentChanged" BorderThickness="0"
                                 LostFocus="RichTextBoxAdv_LostFocus" OverridesDocumentBackground="True"
                                 LayoutType="Continuous"
                                 RequestNavigate="Editor_RequestNavigate"/>

        </DockPanel>
    </Border>
</UserControl>