Add RichTextBox

[Liat]

H,
I try to add richTextBox to the window and I get this Error:
"The Component Telerik.windows.Documents.UI.Adorner.ImageAdornerUI does not have a resource identified by the uri 
Telerik.windows.Documents;component /UI/Adorner/ImageAdornerUI .xaml"
Thanks. 

[Boby]

Hello Liat,
Can you provide us with more details on how to reproduce the issue?

Greetings,
Boby
the Telerik team

[John]

I am seeing the same message in Expression Blend 4 only (not in Visual Studio 2010).  This only started happening recently, I think it may have coincided with me adding two new references: Telerik.Windows.Controls.FixedDocumentViewers and Telerik.Windows.Documents.Fixed.  I already had a reference to Telerik.Windows.Documents prior to adding those two (since I was already using the RadRichTextBox), and there was no problem.  Could someone please look into this?

[John]

I wonder if this if the result of an issue with the Blend designer where the full pack uri syntax is required for it to resolve resources.  For instance, I discovered this limitation of the designer when I generated a RadRichTextBoxRibbonUI control.  By default, all of the uris that are generated in the xaml of that control (for image sources, etc.) use the /Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/saveas.png format.  Right away, the blend designer complained that it could not locate any of the resources that were using uris of this style.  I had to manually go in and append the pack://application:,,, prefix (technically completing the 'full and correct' uri syntax) to each of the uris in order to get the designer to resolve the resources.  Perhaps this is the same situation here, since the /Telerik.windows.Documents;component /UI/Adorner/ImageAdornerUI .xaml syntax does not include the (optional in Visual Studio 2010) pack://application:,,, prefix.  Could someone from Telerik maybe compile me a new version of the Telerik.Windows.Documents.dll that adds this prefix to the uri to see if this resolves the issue in the Blend designer?  I'm happy to test this fix, as I have lost the use of the Blend designer now with controls that are using the RadRichTextBox, and this is really impeding my work.  Thanks!

[Iva Toteva]

Hi John,

It is true that some of the images in the XAML of RadRichTextBoxRibbonUI generated by default specify the image sources without the prefix "pack://application,,,". As far as I have tested, this is true for the following two images:

Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/HeaderFromTop.png" 
Source="/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/FooterFromBottom.png"

The way they are declared, an error will be reported and the images will not be visible in the designer. However, when the application is run, the images will be shown as expected.

You can manually change the Sources to:

Source="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/HeaderFromTop.png"
Source="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/FooterFromBottom.png"

in order to avoid the errors and show the images in the designer.

We will log the issue for revision in order to generate the XAML using the "pack://application:,,," prefix by default in the future.

As for the ImageAdornerUI, we were not able to reproduce the issue. Could you share some details as to what version of the controls you are using, as the downloads in your profile show 2011.3.1220 as the only version you have downloaded, while RadPdfViewer for WPF was only introduced in 2012.1.0215.

Looking forward to your reply.

Greetings,
Iva Toteva
the Telerik team

[John]

Hi Iva, thanks for looking into this.  I am using RadControls for WPF Q1 2012 (that is the version my company purchased).  Let me give you an idea as to how I am using the RadRichTextBox in my project.  I am using it in a WPF SketchFlow Application from Expression Blend 4 + SketchFlow.  I have created a custom class derived from RadRichTextBox called 'TelerikBindableRadRichTextBox', in which I have exposed the 'Document' property of the RadRichTextBox as a DependencyProperty called 'BindableDocument' for direct two-way binding to a RadDocument from a View Model.  I then wrapped this custom control within a user control which combines it with two other user controls: a Ribbon user control (encapsulates the RadRichTextBoxRibbonUI control) for use with the RadRichTextBox, and a preview popup control (encapsulates the RadPdfViewer control) for viewing the contents of the RadRichTextBox in a print-preview like format as a PDF.  So, just to be clear, my User control contains three child controls: the 'TelerikBindableRadRichTextBox', the Ribbon user control, and the Preview user control, as well as some other controls like save button, cancel button, etc.  The funny thing is, the problem I am experiencing has only started recently, and it seems to have coincided with the adding of the Preview control.  That is why I hypothesized in the previous post that it may have something to do with adding references to Telerik.Windows.Controls.FixedDocumentViewer and Telerik.Windows.Documents.Fixed.  Ever since then, I get the aforementioned designer error in Blend.  Once I saw the '/Telerik.windows.Documents;component /UI/Adorner/ImageAdornerUI .xaml' resource name in the error message, I made the connection that perhaps this could be the result of the uri format within the Telerik.Windows.Documents assembly.  Strange how this problem only surfaced recently, though.  I hope this information is helpful in tracking down the problem on your end.

[John]

I have attached a screenshot of the exception's stack trace from the Blend designer.

[Boby]

Hi John,
Unfortunately we are still not able to reproduce the problem. Could you please open a support ticket and send us attached a sample project that reproduces it, so we can investigate the issue further? You can also review a similar issue reported on stackoverflow here.

Kind regards,
Boby
the Telerik team

[Senthilselvi]

http://docs.telerik.com/devtools/wpf/controls/radrichtextbox/import/export/features-data-providers.html is not working.

Please do the needful

[Senthilselvi]

Hi
I am using CustomRichTextBox user control inside my Xaml page, Undo and redo commands are not working. Please help me to figure this out.

<UserControl x:Class="RadToolBarUI.CusomRadRichTextBox"
             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:telerik="http://schemas.telerik.com/2008/xaml/presentation"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300" Height="271" Width="524">
    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <telerik:RadToolBarTray DataContext="{Binding ElementName=editor, Path=Commands}" Background="LightGray">
            <telerik:RadToolBarTray.Resources>
                <telerik:FontFamiliesProvider x:Key="FontFamiliesProvider" />
            </telerik:RadToolBarTray.Resources>

            <telerik:RadToolBar Height="32" >
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding PrintCommand}" Size="Medium" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/ApplicationMenu/print.png" Name="button"/>
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ShowSpellCheckingDialogCommand}" Size="Medium" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/EnableSpellCheck.png" />
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ShowFindReplaceDialogCommand}" Size="Medium" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/Find.png" Text="Find/Replace" />
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding CutCommand}" Size="Medium" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/cut.png"  />
                    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding CopyCommand}" Size="Medium" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/copy.png" />
                    <telerik:RadRibbonButton CollapseToSmall="WhenGroupIsMedium" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding PasteCommand}" Size="Medium" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/paste.png" />
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding UndoCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/undo.png" Text="Undo" />
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding RedoCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/redo.png" Text="Redo" />
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <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}" 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>
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:HighlightColorPicker Height="22" Image="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/FontForeColor.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeFontForeColorCommand}" SelectedColor="Red" />
                    <telerik:HighlightColorPicker AutomaticColor="Transparent" Height="22" Image="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/highlight.png" NoColorText="No color" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ChangeFontHighlightColorCommand}" SelectedColor="Yellow" />
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ClearFormattingCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/ClearFormatting16.png" />
                </telerik:RadButtonGroup>
            </telerik:RadToolBar>

            <telerik:RadToolBar Band="1" Height="32">
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonButton SmallImage ="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/Picture.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=InsertPictureCommand}" Size="Medium" />
                    <telerik:RadRibbonButton SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/inserthyperlink.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ShowInsertHyperlinkDialogCommand}" Size="Small" />
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleBoldCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/bold.png" />
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleItalicCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/italic.png" />
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleUnderlineCommand}" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/underline.png" />
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding Path=ToggleStrikethroughCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/Strikethrough16.png" />
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonToggleButton CommandParameter="Left" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ChangeTextAlignmentCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/alignleft.png" Text="Align Left" />
                    <telerik:RadRibbonToggleButton CommandParameter="Center" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ChangeTextAlignmentCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/aligncenter.png" Text="Center" />
                    <telerik:RadRibbonToggleButton CommandParameter="Right" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ChangeTextAlignmentCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/alignright.png" Text="Align Right" />
                    <telerik:RadRibbonToggleButton CommandParameter="Justify" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ChangeTextAlignmentCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/alignjustify.png" Text="Justify" />
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding DecrementParagraphLeftIndentCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/outdent.png" />
                    <telerik:RadRibbonButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding IncrementParagraphLeftIndentCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/indent.png" />
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ToggleBulletsCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/list-bullets.png" />
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ToggleNumberedCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/list-numbered.png" />
                    <telerik:RadRibbonDropDownButton Size="Small" SmallImage="pack://application:,,,/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 ChangeListStyleCommand}" ViewportHeight="176" ViewportWidth="266">
                                    <telerik:RadGalleryItem Image="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNone.png" Tag="None" />
                                    <telerik:RadGalleryItem Image="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListBulleted.png" Tag="Bulleted" />
                                    <telerik:RadGalleryItem Image="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNumbered.png" Tag="Numbered" />
                                    <telerik:RadGalleryItem Image="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNumberedParenthesis.png" Tag="NumberedParenthesis" />
                                    <telerik:RadGalleryItem Image="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/MultilevelListNumberedHierarchical.png" Tag="NumberedHierarchical" />
                                </telerik:RadGallery>
                            </StackPanel>
                        </telerik:RadRibbonDropDownButton.DropDownContent>
                    </telerik:RadRibbonDropDownButton>
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonButton LargeImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/Symbol.png" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ShowInsertSymbolWindowCommand}" Size="Large" Text="Symbol" />
                    <telerik:RadRibbonDropDownButton CollapseToMedium="WhenGroupIsMedium" Command="{Binding InsertTableCommand}" LargeImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/32/InsertTable.png" Size="Large" Text="Insert">
                        <telerik:RadRibbonDropDownButton.DropDownContent>
                            <StackPanel>
                                <telerik:RadRibbonButton ClickMode="Press">
                                    <telerik:TableSizePicker Command="{Binding InsertTableCommand}" />
                                </telerik:RadRibbonButton>
                                <telerik:RadMenuItem IsSeparator="True" />
                                <telerik:RadRibbonButton HorizontalAlignment="Stretch" telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ShowInsertTableDialogCommand}" Size="Medium" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/InsertTable.png" Text="Insert Table..." />
                            </StackPanel>
                        </telerik:RadRibbonDropDownButton.DropDownContent>
                    </telerik:RadRibbonDropDownButton>
                </telerik:RadButtonGroup>
                <telerik:RadToolBarSeparator />
                <telerik:RadButtonGroup>
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ToggleSubscriptCommand}" Size="Small" SmallImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/subscript.png" VerticalAlignment="Bottom" />
                    <telerik:RadRibbonToggleButton telerik:RadRichTextBoxRibbonUI.RichTextCommand="{Binding ToggleSuperscriptCommand}" Size="Small" LargeImage="pack://application:,,,/Telerik.Windows.Controls.RichTextBoxUI;component/Images/MSOffice/16/superscript.png" />
                </telerik:RadButtonGroup>


            </telerik:RadToolBar>


        </telerik:RadToolBarTray>

        <telerik:RadRichTextBox Grid.Row="1"  Name="radNotes" />
        <!--<telerik:DocumentRuler Grid.Row="1" AssociatedRichTextBox="{Binding ElementName=editor, Mode=OneTime}" />-->

        <telerik:RtfDataProvider Rtf="{Binding ElementName=CustomRichTextBoxTest, Path=TextFormatter,Mode=TwoWay}" RichTextBox="{Binding ElementName=radNotes}" x:Name="RtfDataProvider" />
    </Grid>
</UserControl>



Thanks
Selvi

[Tanya]

Hi Selvi,

The RadToolBarTrays' DataContext should be bound to a RadRichTextBoxs' Commands. In this case the name of the RichTextBox is radNotes, but the DataContext of RadToolBarTray is bound to the Commands property of editor - there is no control with this name. Please, find below what I exactly mean:

<telerik:RadToolBarTray DataContext="{Binding ElementName=radNotes, Path=Commands}" Background="LightGray">

More information can be found in the Commands article.

Please, let us know if you have any further questions.

Regards,
Tanya
Telerik

 

 

[Russell]

I am having the same problem in WPF.  An existing wpf form has a Telerik RadRichTextBox in a UserControl.

The user control displays when run but fails to display in the xaml designer ... throwing an exception.

see screen shot attached

[Tanya]

Hi Russell,

We have observed a similar error when there is a mismatch between the version numbers of the referred assemblies or a missing reference. Could you please verify that the Telerik.Windows.Controls.ImageEditor.dll with the correct version is referred the project? 

All the required references for RadRichTextBox are listed in the Getting Started article in our documentation.

Hope this helps. 

Regards,
Tanya
Telerik by Progress