HTML Formatting Table Problems

2 posts, 0 answers
  1. Nick Wood
    Nick Wood avatar
    126 posts
    Member since:
    Feb 2010

    Posted 06 Mar 2012 Link to this post

    Hi There
    Firstly sorry for all the code, I hate it when people do this.

    I have created a simple UserControl that extends the RichTextBox with a few DependencyProperties to bind the raw text string. It uses the HTML formatter to convert the visual content to HTML.

    The issue is that when we insert a table, the content in the RichTextBox completly dissappears. Please see the attached screenshots of a before and after (adding a table). Notice the horizontal scrollbar down the bottom.

    Here is the XAML:
    <UserControl x:Class="CDM.CustomSLControls.TextEditing.DetailedRichTextboxEntry"
    xmlns:telerikRibbonView="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.RibbonView"
    xmlns:telerikHtml="clr-namespace:Telerik.Windows.Documents.FormatProviders.Html;assembly=Telerik.Windows.Documents.FormatProviders.Html"
    FontFamily="Arial" FontSize="11" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
    mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="800">
    <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="*"/>
    <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <telerik:RadRichTextBoxRibbonUI ApplicationButtonVisibility="Collapsed" TitleBarVisibility="Visible"
    ApplicationName="" DataContext="{Binding Path=Commands, ElementName=editor}"
    Name="radRichTextBoxRibbonUI">
    <telerik:RadRichTextBoxRibbonUI.QuickAccessToolBar>
    <telerik:QuickAccessToolBar>
    <telerik:RadRibbonSplitButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=UndoCommand}" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/undo.png" Text="Undo">
    <telerik:RadRibbonSplitButton.DropDownContent>
    <telerik:MultipleUndoControl telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=MultipleUndoCommand}" />
    </telerik:RadRibbonSplitButton.DropDownContent>
    </telerik:RadRibbonSplitButton>
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=RedoCommand}" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/redo.png" Text="Redo" />
    </telerik:QuickAccessToolBar>
    </telerik:RadRichTextBoxRibbonUI.QuickAccessToolBar>
    <telerik:RadRichTextBoxRibbonUI.Resources>
    <telerik:FontFamiliesProvider x:Key="FontFamiliesProvider" />
    </telerik:RadRichTextBoxRibbonUI.Resources>
    <telerik:RadRibbonTab Header="Home" Width="50">
    <telerik:RadRibbonGroup Header="Clipboard">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="0" Variant="Medium" />
    </telerik:RadRibbonGroup.Variants>
    <StackPanel>
    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=CutCommand}" telerik:ScreenTip.Description="Cut the selection and put it on the Clipboard." telerik:ScreenTip.Title="Cut" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/cut.png" Text="Cut" />
    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=CopyCommand}" telerik:ScreenTip.Description="Copy the selection and put it on the Clipboard." telerik:ScreenTip.Title="Copy" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/copy.png" Text="Copy" />
    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=PasteCommand}" telerik:ScreenTip.Description="Paste the contents of the Clipboard." telerik:ScreenTip.Title="Paste" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/paste.png" Text="Paste" />
    </StackPanel>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup DialogLauncherVisibility="Visible" Header="Font" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowFontPropertiesDialogCommand}" telerik:ScreenTip.Description="Show the font dialog box." telerik:ScreenTip.Title="Font" telerik:ScreenTip.Icon="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/FontDialog.png">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="4" Variant="Medium" />
    <telerik:GroupVariant Priority="6" Variant="Small" />
    <telerik:GroupVariant Priority="7" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadOrderedWrapPanel>
    <StackPanel Orientation="Horizontal">
    <telerik:RadRibbonComboBox CanAutocompleteSelectItems="False" CanKeyboardNavigationSelectItems="False" CommandParameter="{Binding RelativeSource={RelativeSource Self}, Path=SelectedValue}" Height="21" IsReadOnly="True" ItemsSource="{Binding Source={StaticResource FontFamiliesProvider}, Path=RegisteredFonts}" OpenDropDownOnFocus="True" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeFontFamilyCommand}" telerik:ScreenTip.Description="Change the font family." telerik:ScreenTip.Title="Font" Width="132" />
    <telerik:RadRibbonComboBox CanAutocompleteSelectItems="False" CanKeyboardNavigationSelectItems="False" CommandParameter="{Binding RelativeSource={RelativeSource Self}, Path=SelectedItem.Tag}" Height="21" IsEditable="True" IsReadOnly="True" IsTextSearchEnabled="False" OpenDropDownOnFocus="True" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeFontSizeCommand}" telerik:ScreenTip.Description="Change the font size." telerik:ScreenTip.Title="Font Size" Width="45">
    <telerik:RadRibbonComboBoxItem Content="8" Tag="10.67" />
    <telerik:RadRibbonComboBoxItem Content="9" Tag="12" />
    <telerik:RadRibbonComboBoxItem Content="10" Tag="13.33" />
    <telerik:RadRibbonComboBoxItem Content="11" Tag="14.67" />
    <telerik:RadRibbonComboBoxItem Content="12" Tag="16" />
    <telerik:RadRibbonComboBoxItem Content="14" Tag="18.67" />
    <telerik:RadRibbonComboBoxItem Content="16" Tag="21.33" />
    <telerik:RadRibbonComboBoxItem Content="18" Tag="24" />
    <telerik:RadRibbonComboBoxItem Content="20" Tag="26.67" />
    <telerik:RadRibbonComboBoxItem Content="22" Tag="29.33" />
    <telerik:RadRibbonComboBoxItem Content="24" Tag="32" />
    <telerik:RadRibbonComboBoxItem Content="26" Tag="34.67" />
    <telerik:RadRibbonComboBoxItem Content="28" Tag="37.33" />
    <telerik:RadRibbonComboBoxItem Content="36" Tag="48" />
    <telerik:RadRibbonComboBoxItem Content="48" Tag="64" />
    <telerik:RadRibbonComboBoxItem Content="72" Tag="96" />
    </telerik:RadRibbonComboBox>
    </StackPanel>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=IncrementFontSizeCommand}" telerik:ScreenTip.Description="Increase the font size." telerik:ScreenTip.Title="Grow Font" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/font-increasesize.png" />
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=DecrementFontSizeCommand}" telerik:ScreenTip.Description="Decrease the font size." telerik:ScreenTip.Title="Shrink Font" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/font-decreasesize.png" />
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ClearFormattingCommand}" telerik:ScreenTip.Description="Clear all the formatting from the selection, leaving only the plain text." telerik:ScreenTip.Title="Clear Formatting" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/ClearFormatting16.png" />
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleBoldCommand}" telerik:ScreenTip.Description="Make the selected text bold." telerik:ScreenTip.Title="Bold" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/bold.png" />
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleItalicCommand}" telerik:ScreenTip.Description="Italicize the selected text." telerik:ScreenTip.Title="Italic" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/italic.png" />
    <telerik:RadRibbonSplitButton IsToggle="True" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleUnderlineCommand}" telerik:ScreenTip.Description="Underline the selected text." telerik:ScreenTip.Title="Underline" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/underline.png">
    <telerik:RadRibbonSplitButton.DropDownContent>
    <telerik:RadGallery ItemHeight="26" ItemWidth="156" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeUnderlineDecorationCommand}" ViewportHeight="210" ViewportWidth="157">
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline1.png" Tag="Line" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline2.png" Tag="DoubleLine" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline3.png" Tag="ThickLine" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline4.png" Tag="DottedLine" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline5.png" Tag="DashedLine" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline6.png" Tag="DotDashedLine" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline7.png" Tag="DotDotDashedLine" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/underline8.png" Tag="Wave" />
    </telerik:RadGallery>
    </telerik:RadRibbonSplitButton.DropDownContent>
    </telerik:RadRibbonSplitButton>
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleStrikethroughCommand}" telerik:ScreenTip.Description="Draw a line through the middle of the selected text." telerik:ScreenTip.Title="Strikethrough" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/Strikethrough16.png" />
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleSubscriptCommand}" telerik:ScreenTip.Description="Create small letters below the text baseline." telerik:ScreenTip.Title="Subscript" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/subscript.png" />
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleSuperscriptCommand}" telerik:ScreenTip.Description="Create small text above the line of text." telerik:ScreenTip.Title="Superscript" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/superscript.png" />
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:RadDropDownButton Height="22"
    telerik:ScreenTip.Description="Make text look like it was marked with a highlighter pen."
    telerik:ScreenTip.Title="Text Highlight Colour">
    <telerik:RadDropDownButton.Content>
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/highlight.png" />
    </telerik:RadDropDownButton.Content>
    <telerik:RadDropDownButton.DropDownContent>
    <telerik:RadColorEditor SelectedColor="White" x:Name="coloreditor"
    Height="230" HistoryCapacity="8" Padding="12 12 12 33" SelectedColorChanged="coloreditor_SelectedColorChanged" />
    </telerik:RadDropDownButton.DropDownContent>
    </telerik:RadDropDownButton>
    <telerik:RadDropDownButton Height="22"
    telerik:ScreenTip.Description="Change the text colour."
    telerik:ScreenTip.Title="Font Colour">
    <telerik:RadDropDownButton.Content>
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/FontForeColor.png" />
    </telerik:RadDropDownButton.Content>
    <telerik:RadDropDownButton.DropDownContent>
    <telerik:RadColorEditor x:Name="FontColourEditor" SelectedColor="White"
    Height="230" HistoryCapacity="8" Padding="12 12 12 33" SelectedColorChanged="FontColourEditor_SelectedColorChanged" />
    </telerik:RadDropDownButton.DropDownContent>
    </telerik:RadDropDownButton>
    </telerik:RadButtonGroup>
    </telerik:RadOrderedWrapPanel>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup DialogLauncherVisibility="Visible" Header="Paragraph" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowParagraphPropertiesDialogCommand}" telerik:ScreenTip.Description="Show the Paragraph dialog box." telerik:ScreenTip.Title="Paragraph" telerik:ScreenTip.Icon="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/PropertiesDialog.png">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="3" Variant="Medium" />
    <telerik:GroupVariant Priority="5" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadOrderedWrapPanel>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleBulletsCommand}" telerik:ScreenTip.Description="Start a bulleted list." telerik:ScreenTip.Title="Bullets" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/list-bullets.png" />
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleNumberedCommand}" telerik:ScreenTip.Description="Start a numbered list." telerik:ScreenTip.Title="Numbering" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/list-numbered.png" />
    <telerik:RadRibbonDropDownButton telerik:ScreenTip.Description="Start a multilevel list. Click the arrow to choose different multilevel list styles." telerik:ScreenTip.Title="Multilevel List" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/MultilevelList.png">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <StackPanel>
    <telerik:RadGroupHeader Content="List Library" />
    <telerik:RadGallery ItemHeight="88" ItemWidth="88" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeListStyleCommand}" ViewportHeight="176" ViewportWidth="266">
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNone.png" Tag="None" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListBulleted.png" Tag="Bulleted" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNumbered.png" Tag="Numbered" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNumberedParenthesis.png" Tag="NumberedParenthesis" />
    <telerik:RadGalleryItem Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNumberedHierarchical.png" Tag="NumberedHierarchical" />
    </telerik:RadGallery>
    </StackPanel>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=DecrementParagraphLeftIndentCommand}" telerik:ScreenTip.Description="Decrease the indent level of the paragraph." telerik:ScreenTip.Title="Decrease Indent" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/outdent.png" />
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=IncrementParagraphLeftIndentCommand}" telerik:ScreenTip.Description="Increase the indent level of the paragraph." telerik:ScreenTip.Title="Increase Indent" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/indent.png" />
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonToggleButton CommandParameter="LeftToRight" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeParagraphFlowDirectionCommand}" telerik:ScreenTip.Description="Set the direction of text to be displayed from left to right." telerik:ScreenTip.Title="Left-To-Right Text Direction" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/LeftToRightFlowDirection.png" Text="Left-to-Right Text Direction" />
    <telerik:RadRibbonToggleButton CommandParameter="RightToLeft" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeParagraphFlowDirectionCommand}" telerik:ScreenTip.Description="Set the direction of text to be displayed from right to left." telerik:ScreenTip.Title="Right-To-Left Text Direction" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/RightToLeftFlowDirection.png" Text="Right-to-Left Text Direction" />
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleFormattingSymbolsCommand}" telerik:ScreenTip.Description="Show paragraph marks and other hidden formatting symbols." telerik:ScreenTip.Title="Show/Hide Formatting Symbols" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/formatting-symbols.png" />
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:RadRibbonToggleButton CommandParameter="Left" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeTextAlignmentCommand}" telerik:ScreenTip.Description="Align text to the left." telerik:ScreenTip.Title="Align Text Left" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/alignleft.png" Text="Align Left" />
    <telerik:RadRibbonToggleButton CommandParameter="Center" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeTextAlignmentCommand}" telerik:ScreenTip.Description="Center text." telerik:ScreenTip.Title="Center" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/aligncenter.png" Text="Center" />
    <telerik:RadRibbonToggleButton CommandParameter="Right" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeTextAlignmentCommand}" telerik:ScreenTip.Description="Align text to the right." telerik:ScreenTip.Title="Align Text Right" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/alignright.png" Text="Align Right" />
    <telerik:RadRibbonToggleButton CommandParameter="Justify" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeTextAlignmentCommand}" telerik:ScreenTip.Description="Align text to both left and right margins, adding extra space between words as necessary." telerik:ScreenTip.Title="Justify" Size="Small" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/alignjustify.png" Text="Justify" />
    </telerik:RadButtonGroup>
    <telerik:RadButtonGroup>
    <telerik:HighlightColorPicker AutomaticColor="Transparent" Height="20" Image="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/ParagraphBackgroundColor.png" NoColorText="No color" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeParagraphBackgroundColorCommand}" telerik:ScreenTip.Description="Color the background behind the selected text or paragraph." telerik:ScreenTip.Title="Shading" SelectedColor="Transparent" />
    </telerik:RadButtonGroup>
    </telerik:RadOrderedWrapPanel>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Editing & Proofing">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="1" Variant="Medium" />
    <telerik:GroupVariant Priority="2" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <StackPanel>
    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowFindReplaceDialogCommand}" telerik:ScreenTip.Description="Find or replace text in the document." telerik:ScreenTip.Title="Find/Replace" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/Find.png" Text="Find/Replace" />
    <telerik:RadRibbonToggleButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleSpellCheckingCommand}" telerik:ScreenTip.Description="Enable/Disable spell checking." telerik:ScreenTip.Title="Spell Check" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/EnableSpellCheck.png" Text="Enable Spell Check" />
    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=OpenContextMenuOnNextSpellingErrorCommand}" telerik:ScreenTip.Description="Open context menu on next spelling error." telerik:ScreenTip.Title="Next Error" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/FindNextSpellingError.png" Text="Find Next Error" />
    </StackPanel>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Styles">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="1" Variant="Medium" />
    <telerik:GroupVariant Priority="2" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:StylesGallery AssociatedRichTextBox="{Binding Path=AssociatedRichTextBox, Mode=OneWay}" />
    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowManageStylesDialogCommand}" Size="Large" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/ChangeStyles.png" Text="Change Styles" telerik:ScreenTip.Title="Change Styles" telerik:ScreenTip.Description="Change the set of styles, colors, fonts and paragraph spacing used in this document." />
    </telerik:RadRibbonGroup>
    </telerik:RadRibbonTab>
    <telerik:RadRibbonTab Header="Insert" Width="45">
    <telerik:RadRibbonGroup Header="Pages">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageBreak.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertPageBreakCommand}" telerik:ScreenTip.Description="Start the next page at the current position." telerik:ScreenTip.Title="Page Break" Size="Large" Text="Page Break" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Tables">
    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding Path=InsertTableCommand}" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTable.png" telerik:ScreenTip.Description="Insert a table into the document." telerik:ScreenTip.Title="Table" Size="Large" Text="Insert">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <StackPanel>
    <telerik:RadRibbonButton ClickMode="Press">
    <telerik:TableSizePicker Command="{Binding Path=InsertTableCommand}" />
    </telerik:RadRibbonButton>
    <telerik:RadMenuItem IsSeparator="True" />
    <telerik:RadRibbonButton HorizontalAlignment="Stretch" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowInsertTableDialogCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/InsertTable.png" Text="Insert Table..." />
    </StackPanel>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Illustrations">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/Picture.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertPictureCommand}" telerik:ScreenTip.Description="Insert a picture from a file." telerik:ScreenTip.Title="Insert Picture from File" Size="Large" Text="Picture" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Links">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/inserthyperlink.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowInsertHyperlinkDialogCommand}" telerik:ScreenTip.Description="Create a link to a Web page, a picture or an e-mail address." telerik:ScreenTip.Title="Insert Hyperlink" Size="Large" Text="Hyperlink" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertBookmark.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowManageBookmarksDialogCommand}" telerik:ScreenTip.Description="Create a bookmark to assign a name to a specific point in a document." telerik:ScreenTip.Title="Bookmark" Size="Large" Text="Bookmark" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Symbols">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/Symbol.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowInsertSymbolWindowCommand}" telerik:ScreenTip.Description="Insert symbols that are not on your keyboard, such as copyright symbols, trademark symbols, paragraph marks, and Unicode characters." telerik:ScreenTip.Title="Insert Symbol" Size="Large" Text="Symbol" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Header & Footer">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/EditHeader.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=EditHeaderCommand}" telerik:ScreenTip.Description="Edit the header of the document." telerik:ScreenTip.Title="Header" Size="Large" Text="Header" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/EditFooter.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=EditFooterCommand}" telerik:ScreenTip.Description="Edit the footer of the document." telerik:ScreenTip.Title="Footer" Size="Large" Text="Footer" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Text">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertDateTime.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowInsertDateTimeDialogCommand}" telerik:ScreenTip.Description="Insert the current date or time into the current document." telerik:ScreenTip.Title="Insert Date and Time" Size="Large" Text="Date & Time" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertPageNumber.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertPageFieldCommand}" telerik:ScreenTip.Description="Insert page numbers into the document." telerik:ScreenTip.Title="Insert Page Number" Size="Large" Text="Page Number" />
    </telerik:RadRibbonGroup>
    </telerik:RadRibbonTab>
    <telerik:RadRibbonTab Header="Page Layout" Width="70">
    <telerik:RadRibbonGroup Header="Page Setup">
    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding Path=ChangePaperTypeCommand}" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageSize.png" telerik:ScreenTip.Description="Choose a paper size for the current section." telerik:ScreenTip.Title="Page Size" Size="Large" Text="Size">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <telerik:RadGallery ItemWidth="184" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangePaperTypeCommand}" ViewportWidth="185">
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="A0">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="A0" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (33.05" x 46.78")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="A1">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="A1" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (23.39" x 33.05")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="A2">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="A2" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (16.53" x 23.39")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="A3">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="A3" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (11.7" x 16.53")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="A4">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="A4" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (8.26" x 11.7")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="A5">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="A5" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (5.83" x 8.26")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="RA0">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="RA0" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (33.86" x 48.03")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="RA1">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="RA1" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (24.01" x 33.86")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="RA2">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="RA2" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (16.93" x 24.01")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="RA3">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="RA3" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (12.01" x 16.93")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="RA4">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="RA4" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (8.46" x 12.01")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="RA5">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="RA5" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (4.76" x 8.46")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="B0">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="B0" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (39.38" x 55.67")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="B1">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="B1" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (27.83" x 39.38")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="B2">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="B2" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (59.05" x 19.68")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="B3">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="B3" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (13.91" x 19.68")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="B4">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="B4" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (10.13" x 14.33")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="B5">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="B5" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (7.17" x 10.13")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Quarto">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Quarto" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (8" x 10")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Foolscap">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Foolscap" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (8" x 13")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Executive">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Executive" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (7.5" x 10")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="GovernmentLetter">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="GovernmentLetter" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (10.5" x 8")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Letter">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Letter" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (8.5" x 11")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Legal">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Legal" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (8.5" x 14")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Ledger">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Ledger" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (17" x 11")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Tabloid">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Tabloid" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (11" x 17")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Post">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Post" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (15.64" x 19.25")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Crown">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Crown" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (20" x 15")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="LargePost">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="LargePost" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (16.5" x 21")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Demy">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Demy" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (17.5" x 22")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Medium">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Medium" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (18" x 23")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Royal">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Royal" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (20" x 25")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Elephant">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Elephant" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (21.74" x 28")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="DoubleDemy">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="DoubleDemy" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (23.5" x 35")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="QuadDemy">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="QuadDemy" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (35" x 45")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="STMT">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="STMT" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (5.5" x 8.5")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Folio">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Folio" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (8.5" x 13")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Statement">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Statement" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (5.5" x 8.5")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Size10x14">
    <StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="Size10x14" VerticalAlignment="Center" />
    <TextBlock FontWeight="Normal" Text=" (10" x 14")" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    </telerik:RadGallery>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding Path=ChangePageMarginsCommand}" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageMargin.png" telerik:ScreenTip.Description="Select the margin sizes for the current section." telerik:ScreenTip.Title="Margins" Size="Large" Text="Margins">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <telerik:RadGallery ItemHeight="54" ItemWidth="114" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangePageMarginsCommand}" ViewportHeight="270" ViewportWidth="115">
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Normal">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/PageMarginNormal.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Normal" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Narrow">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/PageMarginNarrow.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Narrow" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Moderate">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/PageMarginModerate.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Moderate" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Wide">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/PageMarginWide.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Wide" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Office2003">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/PageMarginNormal.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Office2003" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    </telerik:RadGallery>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding Path=ChangePageOrientationCommand}" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageOrientation.png" telerik:ScreenTip.Description="Switch the pages between portrait and landscape layouts." telerik:ScreenTip.Title="Page Orientation" Size="Large" Text="Orientation">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <telerik:RadGallery ItemHeight="54" ItemWidth="109" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangePageOrientationCommand}" ViewportHeight="216" ViewportWidth="110">
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Portrait">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageOrientationPortrait.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Portrait" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Rotate90">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageOrientationLandscape.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Landscape" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Rotate180">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageOrientationRotate180.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Rotate 180" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    <telerik:RadGalleryItem HorizontalContentAlignment="Left" Tag="Rotate270">
    <StackPanel Orientation="Horizontal">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageOrientationRotate270.png" Stretch="None" />
    <TextBlock FontWeight="Bold" Text="Rotate 270" VerticalAlignment="Center" />
    </StackPanel>
    </telerik:RadGalleryItem>
    </telerik:RadGallery>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    </telerik:RadRibbonGroup>
    </telerik:RadRibbonTab>
    <telerik:RadRibbonTab Header="View" Width="45">
    <telerik:RadRibbonGroup Header="Document Views">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="2" Variant="Medium" />
    <telerik:GroupVariant Priority="8" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadRibbonButton CollapseToMedium="WhenGroupIsMedium" CollapseToSmall="WhenGroupIsSmall" CommandParameter="Flow" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/web-C.PNG" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeLayoutModeCommand}" telerik:ScreenTip.Description="View the document as it would look as a Web page." telerik:ScreenTip.Title="Web Layout" Size="Large" Text="Web Layout" />
    <telerik:RadRibbonButton CollapseToMedium="WhenGroupIsMedium" CollapseToSmall="WhenGroupIsSmall" CommandParameter="Paged" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PageBreak.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeLayoutModeCommand}" telerik:ScreenTip.Description="View the documetn as it will appear on the printed page." telerik:ScreenTip.Title="Print Layout" Size="Large" Text="Print Layout" />
    <telerikRibbonView:RadRibbonButton CollapseToMedium="WhenGroupIsMedium" CollapseToSmall="WhenGroupIsSmall" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/properties32.png" Size="Large" Text="Show Statistics" Click="Statistics_Click" />
    <telerikRibbonView:RadRibbonButton CollapseToMedium="WhenGroupIsMedium" CollapseToSmall="WhenGroupIsSmall" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/inspectdocument.png" Size="Large" Text="Document Structure" Click="ViewDocumentStructure_Click" />
    </telerik:RadRibbonGroup>
    </telerik:RadRibbonTab>
    <telerik:RadRibbonTab Header="Review" Width="50">
    <telerik:RadRibbonGroup Header="Proofing">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/EnableSpellCheck.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowSpellCheckingDialogCommand}" telerik:ScreenTip.Description="Check the spelling of text in the document." telerik:ScreenTip.Title="Spelling" Size="Large" Text="Spell Check" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Comments">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/NewComment.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertCommentCommand}" telerik:ScreenTip.Description="Add a comment about the selection." telerik:ScreenTip.Title="Insert Comment" Size="Large" Text="New Comment" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/DeleteComment.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=DeleteCommentCommand}" telerik:ScreenTip.Description="Delete the selected comment." telerik:ScreenTip.Title="Delete Comment" Size="Large" Text="Delete" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/PreviousComment.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=GoToPreviousCommentCommand}" telerik:ScreenTip.Description="Navigate to the previous comment in the document." telerik:ScreenTip.Title="Previous Comment" Size="Large" Text="Previous" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/NextComment.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=GoToNextCommentCommand}" telerik:ScreenTip.Description="Navigate to the next comment in the document." telerik:ScreenTip.Title="Next Comment" Size="Large" Text="Next" />
    <telerik:RadRibbonToggleButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/ShowHideComments.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleCommentsCommand}" telerik:ScreenTip.Description="Click here to show or hide the comments." telerik:ScreenTip.Title="Show/Hide Comments" Size="Large" Text="Show/Hide Comments" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/DeleteAllComments.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=DeleteAllCommentsCommand}" telerik:ScreenTip.Description="Click here to delete all of the comments in the document." telerik:ScreenTip.Title="Delete All Comments" Size="Large" Text="Delete All" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Protect">
    <telerik:RadRibbonToggleButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/ProtectDocument.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleDocumentProtectionCommand}" Size="Large" Text="Protect Document" telerik:ScreenTip.Title="Toggle Document Protection" telerik:ScreenTip.Description="Restrict how people edit specific parts of the document." />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/ChangeEditingPermissions.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowChangeEditingPermissionsDialogCommand}" Size="Large" Text="Editing Restrictions" telerik:ScreenTip.Title="Change Editing Restrictions" telerik:ScreenTip.Description="Shows the dialog for setting editing restrictions to users/groups." />
    </telerik:RadRibbonGroup>
    </telerik:RadRibbonTab>
    <!--<telerik:RadRibbonTab Header="Table" Width="60">
    <telerik:RadRibbonGroup Header="Table">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="2" Variant="Medium" />
    <telerik:GroupVariant Priority="8" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding Path=InsertTableCommand}" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTable.png" telerik:ScreenTip.Description="Insert a table into the document." telerik:ScreenTip.Title="Table" Size="Large" Text="Insert">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <StackPanel>
    <telerik:RadRibbonButton ClickMode="Press">
    <telerik:TableSizePicker Command="{Binding Path=InsertTableCommand}" />
    </telerik:RadRibbonButton>
    <telerik:RadMenuItem IsSeparator="True" />
    <telerik:RadRibbonButton HorizontalAlignment="Stretch" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowInsertTableDialogCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/InsertTable.png" Text="Insert Table..." />
    </StackPanel>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/DeleteTable.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=DeleteTableCommand}" telerik:ScreenTip.Description="Delete the entire table." telerik:ScreenTip.Title="Delete Table" Size="Large" Text="Delete" />
    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding Path=SelectTableEmptyCommand}" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/SelectTableTools.png" telerik:ScreenTip.Description="Select rows, columns, cells, or the entire table." telerik:ScreenTip.Title="Select Table" Size="Large" Text="Select">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <StackPanel>
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=SelectTableCellCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/SelectTableCell.png" Text="Select Cell" />
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=SelectTableColumnCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/SelectTableColumn.png" Text="Select Column" />
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=SelectTableRowCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/SelectTableRow.png" Text="Select Row" />
    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=SelectTableCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/SelectTable.png" Text="Select Table" />
    </StackPanel>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/TableProperties.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowTablePropertiesDialogCommand}" telerik:ScreenTip.Description="Show the Table Properties dialog box to change advanced table properties." telerik:ScreenTip.Title="Table Properties" Size="Large" Text="Properties" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Rows">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="2" Variant="Medium" />
    <telerik:GroupVariant Priority="8" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTableRow.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertTableRowCommand}" telerik:ScreenTip.Description="Insert a new row." telerik:ScreenTip.Title="Insert Row" Size="Large" Text="Insert Row" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTableRowBelow.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertTableRowBelowCommand}" telerik:ScreenTip.Description="Add a new row directly below the selected row." telerik:ScreenTip.Title="Insert Rows Below" Size="Large" Text="Insert Below" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTableRowAbove.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertTableRowAboveCommand}" telerik:ScreenTip.Description="Add a new row directly above the selected row." telerik:ScreenTip.Title="Insert Rows Above" Size="Large" Text="Insert Above" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/DeleteTableRows.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=DeleteTableRowCommand}" telerik:ScreenTip.Description="Delete the selected row." telerik:ScreenTip.Title="Delete Row" Size="Large" Text="Delete Row" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Columns">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="2" Variant="Medium" />
    <telerik:GroupVariant Priority="8" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTableColumn.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertTableColumnCommand}" telerik:ScreenTip.Description="Insert a new column." telerik:ScreenTip.Title="Insert Column" Size="Large" Text="Insert Column" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTableColumnToTheLeft.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertTableColumnToTheLeftCommand}" telerik:ScreenTip.Description="Add a new column directly to the left of the selected column." telerik:ScreenTip.Title="Insert Columns to the Left" Size="Large" Text="Insert Left" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTableColumnToTheRight.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertTableColumnToTheRightCommand}" telerik:ScreenTip.Description="Add a new column directly to the right of the selected column." telerik:ScreenTip.Title="Insert Columns to the Right" Size="Large" Text="Insert Right" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/DeleteTableColumns.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=DeleteTableColumnCommand}" telerik:ScreenTip.Description="Delete the selected column." telerik:ScreenTip.Title="Delete Column" Size="Large" Text="Delete Column" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Merge">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="2" Variant="Medium" />
    <telerik:GroupVariant Priority="8" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/MergeTableCells.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=MergeTableCellsCommand}" telerik:ScreenTip.Description="Merge the selected cells into one cell." telerik:ScreenTip.Title="Merge Cells" Size="Large" Text="Merge Cells" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Cell Size">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="2" Variant="Medium" />
    <telerik:GroupVariant Priority="8" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding Path=SelectTableEmptyCommand}" LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/AutoFit.png" telerik:ScreenTip.Description="Automatically resize the column widths based on the size of the text in them or keep the widths with fixed size." telerik:ScreenTip.Title="AutoFit/Fixed" Size="Large" Text="AutoFit">
    <telerik:RadRibbonDropDownButton.DropDownContent>
    <StackPanel>
    <telerik:RadRibbonButton CommandParameter="AutoFit" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeTableColumnsLayoutModeCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/AutoFItToWindow.png" Text="AutoFit to Window" />
    <telerik:RadRibbonButton CommandParameter="Fixed" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeTableColumnsLayoutModeCommand}" Size="Medium" SmallImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/FixedColumnWidth.png" Text="Fixed Column Width" />
    </StackPanel>
    </telerik:RadRibbonDropDownButton.DropDownContent>
    </telerik:RadRibbonDropDownButton>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Alignment">
    <telerik:RadRibbonGroup.Variants>
    <telerik:GroupVariant Priority="1" Variant="Medium" />
    <telerik:GroupVariant Priority="3" Variant="Collapsed" />
    </telerik:RadRibbonGroup.Variants>
    <Grid>
    <Grid.ColumnDefinitions>
    <ColumnDefinition />
    <ColumnDefinition />
    <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
    <RowDefinition />
    <RowDefinition />
    <RowDefinition />
    </Grid.RowDefinitions>
    <telerik:RadToggleButton CommandParameter="Left,Top" CornerRadius="3" Grid.Column="0" Grid.Row="0" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Align text to the top left corner of the cell." telerik:ScreenTip.Title="Align Top Left">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/LeftTopCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Center,Top" CornerRadius="3" Grid.Column="1" Grid.Row="0" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Center text and align it to the top of the cell." telerik:ScreenTip.Title="Align Top Center">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/CenterTopCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Right,Top" CornerRadius="3" Grid.Column="2" Grid.Row="0" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Align text to the top right corner of the cell." telerik:ScreenTip.Title="Align Top Right">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/RightTopCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Left,Center" CornerRadius="3" Grid.Column="0" Grid.Row="1" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Center text vertically and align it to the left side of the cell." telerik:ScreenTip.Title="Align Center Left">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/LeftMiddleCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Center,Center" CornerRadius="3" Grid.Column="1" Grid.Row="1" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Center text horizontally and vertically within the cell." telerik:ScreenTip.Title="Align Center">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/CenterMiddleCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Right,Center" CornerRadius="3" Grid.Column="2" Grid.Row="1" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Center text vertically and align it to the right side of the cell." telerik:ScreenTip.Title="Align Center Right">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/RightMiddleCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Left,Bottom" CornerRadius="3" Grid.Column="0" Grid.Row="2" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Align text to the bottom left corner of the cell." telerik:ScreenTip.Title="Align Bottom Left">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/LeftBottomCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Center,Bottom" CornerRadius="3" Grid.Column="1" Grid.Row="2" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Center text and align it to the bottom of the cell." telerik:ScreenTip.Title="Align Bottom Center">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/CenterBottomCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    <telerik:RadToggleButton CommandParameter="Right,Bottom" CornerRadius="3" Grid.Column="2" Grid.Row="2" IsBackgroundVisible="False" IsTabStop="False" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=TableCellContentAlignmentCommand}" telerik:ScreenTip.Description="Align text to the bottom right corner of the cell." telerik:ScreenTip.Title="Align Bottom Right">
    <Image Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/RightBottomCellAlignment.png" Stretch="None" />
    </telerik:RadToggleButton>
    </Grid>
    </telerik:RadRibbonGroup>
    </telerik:RadRibbonTab>-->
    <telerik:RadRibbonTab Header="Headers & Footers" Width="100">
    <telerik:RadRibbonGroup Header="Header & Footer">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/EditHeader.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=EditHeaderCommand}" telerik:ScreenTip.Description="Edit the header of the document." telerik:ScreenTip.Title="Header" Size="Large" Text="Header" />
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/EditFooter.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=EditFooterCommand}" telerik:ScreenTip.Description="Edit the footer of the document." telerik:ScreenTip.Title="Footer" Size="Large" Text="Footer" />
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Options">
    <StackPanel>
    <CheckBox Content="Different First Page" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleDifferentFirstPageHeaderFooterCommand}" telerik:ScreenTip.Description="Specify a unique header and footer for the first page of the document." telerik:ScreenTip.Title="Different First Page" />
    <CheckBox Content="Different Odd & Even Pages" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleDifferentOddAndEvenPagesHeaderFooterCommand}" telerik:ScreenTip.Description="Specify that odd-numbered pages should have a different header and footer from even-numbered pages." telerik:ScreenTip.Title="Different Odd & Even Pages" />
    </StackPanel>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Position">
    <Grid>
    <Grid.ColumnDefinitions>
    <ColumnDefinition />
    <ColumnDefinition />
    <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
    <RowDefinition Height="24" />
    <RowDefinition Height="24" />
    </Grid.RowDefinitions>
    <Image Grid.Column="0" Grid.Row="0" Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/HeaderFromTop.png" Stretch="None" VerticalAlignment="Center" />
    <TextBlock Grid.Column="1" Grid.Row="0" Text=" Header from Top: " VerticalAlignment="Center" />
    <telerik:RadNumericUpDown Grid.Column="2" Grid.Row="0" IsInteger="true" Minimum="0" NullValue="48" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeSectionHeaderTopMarginCommand}" telerik:ScreenTip.Description="Specify the height of the header area." telerik:ScreenTip.Title="Header Position from Top" />
    <Image Grid.Column="0" Grid.Row="1" Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/FooterFromBottom.png" Stretch="None" VerticalAlignment="Center" />
    <TextBlock Grid.Column="1" Grid.Row="1" Text=" Footer from Bottom: " VerticalAlignment="Center" />
    <telerik:RadNumericUpDown Grid.Column="2" Grid.Row="1" IsInteger="true" Minimum="0" NullValue="48" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeSectionFooterBottomMarginCommand}" telerik:ScreenTip.Description="Specify the height of the footer area." telerik:ScreenTip.Title="Footer Position from Bottom" />
    </Grid>
    </telerik:RadRibbonGroup>
    <telerik:RadRibbonGroup Header="Close">
    <telerik:RadRibbonButton LargeImage="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/ExitHeaderFooterEditMode.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ExitHeaderFooterEditModeCommand}" telerik:ScreenTip.Description="Close the Header and Footer Mode." telerik:ScreenTip.Title="Close Header and Footer" Size="Large" Text="Close Header and Footer" />
    </telerik:RadRibbonGroup>
    </telerik:RadRibbonTab>
    </telerik:RadRichTextBoxRibbonUI>
    <ScrollViewer Grid.Row="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
    <telerik:RadRichTextBox x:Name="editor" Margin="0" AllowDrop="True" Drop="editor_Drop" DocumentContentChanged="editor_DocumentContentChanged"
    ScaleFactor="0.9,0.9" LayoutMode="Flow" />
    </ScrollViewer>
    <telerik:RadRichTextBoxStatusBar Grid.Row="2" AssociatedRichTextBox="{Binding ElementName=editor, Mode=OneTime}" />
    </Grid>
    </UserControl>


    Here is the Code Behind:
    using System.Globalization;
    using System.Windows;
    using System.Windows.Controls;
    using Telerik.Windows.Controls;
    using Telerik.Windows.Controls.RichTextBoxUI;
    using Telerik.Windows.Controls.RichTextBoxUI.Dialogs;
    using Telerik.Windows.Documents.Layout;
    using Telerik.Windows.Documents.Model;
    using Telerik.Windows.Documents.UI;
    using System.IO;
    using Telerik.Windows.Documents.FormatProviders.Html;
    using System;
    using System.Windows.Data;
    namespace CDM.CustomSLControls.TextEditing
    {
    public partial class DetailedRichTextboxEntry : UserControl
    {
    private HtmlFormatProvider formatProvider;
    private bool shouldUpdateDocument = true;
    #region Dependancy Properties
    public string HtmlString
    {
    get { return (string)this.GetValue(HtmlStringProperty); }
    set
    {
    this.SetValue(HtmlStringProperty, value);
    }
    }
    public static readonly DependencyProperty HtmlStringProperty = DependencyProperty.Register(
    "HtmlString", typeof(string), typeof(DetailedRichTextboxEntry), new PropertyMetadata(null, OnHtmlStringChanged));
    private static void OnHtmlStringChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
    DetailedRichTextboxEntry parent = d as DetailedRichTextboxEntry;
    if (e.NewValue != null)
    {
    if (parent.formatProvider.Export(parent.editor.Document) != e.NewValue as string)
    parent.Dispatcher.BeginInvoke(new Action(delegate()
    {
    parent.editor.Document = parent.formatProvider.Import((string)e.NewValue);
    }));
    }
    else
    {
    parent.Dispatcher.BeginInvoke(new Action(delegate()
    {
    parent.editor.Document = parent.formatProvider.Import(string.Empty);
    }));
    }
    }
    public bool HitTestVisible
    {
    get { return (bool)this.GetValue(HitTestVisibleProperty); }
    set
    {
    this.SetValue(HitTestVisibleProperty, value);
    }
    }
    public static readonly DependencyProperty HitTestVisibleProperty = DependencyProperty.Register(
    "HitTestVisible", typeof(bool), typeof(DetailedRichTextboxEntry), new PropertyMetadata(false, OnHitTestVisibleChanged));
    private static void OnHitTestVisibleChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
    DetailedRichTextboxEntry parent = d as DetailedRichTextboxEntry;
    if (e.NewValue != null)
    {
    parent.editor.IsHitTestVisible = (bool)e.NewValue;
    parent.radRichTextBoxRibbonUI.IsHitTestVisible = (bool)e.NewValue;
    }
    }
    #endregion
    public DetailedRichTextboxEntry()
    {
    InitializeComponent();
    formatProvider = new HtmlFormatProvider();
    // Next method calls are required only to work around limitations for using MEF in Examples
    this.editor.FindReplaceDialog = new FindReplaceDialog();
    this.editor.ParagraphPropertiesDialog = new RadParagraphPropertiesDialog();
    this.editor.FontPropertiesDialog = new FontPropertiesDialog();
    this.editor.InsertSymbolWindow = new RadInsertSymbolDialog();
    this.editor.InsertHyperlinkDialog = new RadInsertHyperlinkDialog();
    this.editor.ManageBookmarksDialog = new ManageBookmarksDialog();
    this.editor.ContextMenu = new ContextMenu();
    this.editor.SelectionMiniToolBar = new SelectionMiniToolBar();
    this.editor.ImageMiniToolBar = new ImageMiniToolBar();
    this.editor.InsertTableDialog = new InsertTableDialog();
    this.editor.TablePropertiesDialog = new TablePropertiesDialog();
    this.editor.TableBordersDialog = new TableBordersDialog();
    this.editor.SpellCheckingDialog = new SpellCheckingDialog();
    this.editor.EditCustomDictionaryDialog = new EditCustomDictionaryDialog();
    this.editor.ImageEditorDialog = new ImageEditorDialog();
    this.editor.FloatingBlockPropertiesDialog = new FloatingBlockPropertiesDialog();
    this.editor.InsertDateTimeDialog = new InsertDateTimeDialog();
    ((Telerik.Windows.Documents.Proofing.DocumentSpellChecker)this.editor.SpellChecker).AddDictionary(new Telerik.Windows.Documents.Proofing.RadEn_USDictionary(), CultureInfo.InvariantCulture);
    this.editor.IsHitTestVisible = false;
    this.radRichTextBoxRibbonUI.IsHitTestVisible = false;
    }
    public RadDocument RadDocument
    {
    get
    {
    return this.editor.Document;
    }
    set
    {
    SetupNewDocument(value);
    this.editor.Document = value;
    }
    }
    #region Private Methods
    private void SetupNewDocument(RadDocument document)
    {
    document.ParagraphDefaultSpacingAfter = 10;
    document.PageViewMargin = new SizeF(10, 10);
    document.SectionDefaultPageMargin = new Padding(95);
    }
    #endregion
    #region Private Functions
    private bool IsSupportedImageFormat(string extension)
    {
    if (extension != null)
    {
    extension = extension.ToLower();
    }
    return extension == ".jpg" ||
    extension == ".jpeg" ||
    extension == ".png" ||
    extension == ".bmp";
    }
    #endregion
    #region Events
    private void Statistics_Click(object sender, RoutedEventArgs e)
    {
    string statistics = this.editor.Document.GetStatisticsInfo().ToString();
    MessageBox.Show(statistics, "Document Statistics", MessageBoxButton.OK);
    }
    private void ViewDocumentStructure_Click(object sender, RoutedEventArgs e)
    {
    RadWindow window = new RadWindow();
    DocumentModelTreeViewer documentTreeViewer = new DocumentModelTreeViewer();
    documentTreeViewer.DisplayDocumentLayoutTree(this.editor.Document);
    window.Content = documentTreeViewer;
    //window.Owner = this;
    window.WindowStartupLocation = Telerik.Windows.Controls.WindowStartupLocation.CenterOwner;
    window.Width = 600;
    window.Height = 750;
    //window.Owner = this;
    window.ShowDialog();
    }
    private void editor_Drop(object sender, DragEventArgs e)
    {
    FileInfo[] droppedFiles = e.Data.GetData(DataFormats.FileDrop) as FileInfo[];
    foreach (FileInfo droppedFile in droppedFiles)
    {
    if (this.IsSupportedImageFormat(droppedFile.Extension))
    {
    using (Stream imageStream = droppedFile.OpenRead())
    {
    this.editor.InsertImage(imageStream, droppedFile.Extension);
    }
    }
    }
    }
    private void SetValueRespectingOneWayBindings(string value)
    {
    BindingExpression expression = this.ReadLocalValue(HtmlStringProperty) as BindingExpression;
    if (expression != null && expression.ParentBinding != null)
    {
    if (expression.ParentBinding.Mode == BindingMode.OneWay || expression.ParentBinding.Mode == BindingMode.OneTime)
    {
    return;
    }
    }
    this.SetValue(HtmlStringProperty, value);
    }
    private void editor_DocumentContentChanged(object sender, System.EventArgs e)
    {
    shouldUpdateDocument = false;
    this.SetValueRespectingOneWayBindings(this.formatProvider.Export(this.editor.Document));
    shouldUpdateDocument = true;
    }
    private void coloreditor_SelectedColorChanged(object sender, Telerik.Windows.Controls.ColorEditor.ColorChangeEventArgs e)
    {
    this.editor.ChangeTextHighlightColor(e.Color);
    }
    private void FontColourEditor_SelectedColorChanged(object sender, Telerik.Windows.Controls.ColorEditor.ColorChangeEventArgs e)
    {
    this.editor.ChangeTextForeColor(e.Color);
    }
    #endregion
    }
    }



  2. Martin Ivanov
    Admin
    Martin Ivanov avatar
    104 posts

    Posted 07 Mar 2012 Link to this post

    Hi Nick,
    You have the RadRichTextBox in a scroll viewer, which gives unlimited space to the RadRichTextBox inside it during the layout. When a table is inserted in Flow layout mode, RadRichTextBox tries to expand it to the whole width given by the parent (which is unlimited) and here comes the problem. To solve this you have the following options:
    • remove the ScrollViewer
    • set the Width (MaxWidth) property of the RadRichTextBox or
    • use RadRichTextBox in Paged layout mode.

    For any further questions do not hesitate to contact us again.

    Kind regards,
    Martin
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
Back to Top