How do you bind RichTextBox

22 posts, 1 answers
  1. Bryan
    Bryan avatar
    28 posts
    Member since:
    Jul 2008

    Posted 07 Jul 2010 Link to this post

    I can set the document and retrieve it in code.  Just don't understand the code to bind it.

    Any help would be appreciated.

    Bryan
  2. Bryan
    Bryan avatar
    28 posts
    Member since:
    Jul 2008

    Posted 07 Jul 2010 Link to this post

    I went ahead and created a control with a DependencyProperty

    namespace LeadManager.Client.Controls  
    {  
        using System.IO;  
        using System.Windows;  
        using System.Windows.Controls;  
        using Telerik.Windows.Documents.FormatProviders;  
        using Telerik.Windows.Documents.FormatProviders.Html;  
     
        public partial class RichTextView : UserControl  
        {  
            /// <summary>  
            ///   The <see cref = "HTML" /> dependency property's name.  
            /// </summary>  
            public const string HTMLPropertyName = "HTML";  
     
            /// <summary>  
            ///   Identifies the <see cref = "HTML" /> dependency property.  
            /// </summary>  
            public static readonly DependencyProperty HTMLProperty = DependencyProperty.Register(  
                HTMLPropertyName,  
                typeof (string),  
                typeof (RichTextView),  
                new PropertyMetadata("", HTMLPropertyChanged));  
     
            private string _html;  
     
            public RichTextView()  
            {  
                InitializeComponent();  
                Editor.Loaded += EditorLoaded;  
            }  
     
            /// <summary>  
            ///   Gets or sets the value of the <see cref = "HTML" />  
            ///   property. This is a dependency property.  
            /// </summary>  
            public string HTML  
            {  
                get { return (string) GetValue(HTMLProperty); }  
                set { SetValue(HTMLProperty, value); }  
            }  
     
            public string HTMLText  
            {  
                get 
                {  
                    IDocumentFormatProvider exporter = new HtmlFormatProvider();  
     
                    var output = new MemoryStream();  
                    exporter.Export(Editor.Document, output);  
     
                    output.Seek(0, SeekOrigin.Begin);  
     
                    var reader = new StreamReader(output);  
                    var text = reader.ReadToEnd();  
                    return text;  
                }  
                set 
                {  
                    string content = value;  
                    IDocumentFormatProvider provider = new HtmlFormatProvider();  
     
                    using (var stream = new MemoryStream())  
                    {  
                        var writer = new StreamWriter(stream);  
                        writer.Write(content);  
                        writer.Flush();  
                        stream.Seek(0, SeekOrigin.Begin);  
                        Editor.Document = provider.Import(stream);  
                    }  
                }  
            }  
     
            private void EditorLoaded(object sender, RoutedEventArgs e)  
            {  
                HTMLText = _html;  
            }  
     
            private static void HTMLPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)  
            {  
                ((RichTextView) d).OnHTMLChanged(e);  
            }  
     
            private void OnHTMLChanged(DependencyPropertyChangedEventArgs e)  
            {  
                _html = e.NewValue as string;  
            }  
        }  

    Worked great. 

  3. DevCraft banner
  4. Answer
    Alex
    Admin
    Alex avatar
    129 posts

    Posted 08 Jul 2010 Link to this post

    Hi Bryan,

    Please find attached a sample project with an example that demonstrated how you can create HTML DependencyProperty, that exposes the content of the rich text box in HTML and how this property can be used for binding, using RadRichTextBox Q2 beta version.

    In the example the HTML property is updated by exporting the RadDocument inside the rich text box  ti HTML. This is done whenever the content of the rich text box is changed (on StructureChangeCompleted event of RadDocument) and can cause some performance issues with larger documents. For the official release we will introduce a more convenient event for this purpose.

    Regards,
    Alex
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  5. Marcus Lambert
    Marcus Lambert avatar
    41 posts
    Member since:
    Aug 2009

    Posted 15 Jul 2010 Link to this post

    Hi,
    "For the official release we will introduce a more convenient event for this purpose"
    Did this happen ?

    Thanks
  6. Artur
    Artur avatar
    19 posts
    Member since:
    Jul 2010

    Posted 15 Jul 2010 Link to this post

    Hi,

    I tried the way that Alex  told and it work the binding between RadRichTexBox and TextBox, but between 2 different RadRichTexBox didn't work. How can i put the binding between them (instead having the textbox i want one other RadRichTexBox ).

    By the way, this will be included in today's release??


    thank you
  7. Alex
    Admin
    Alex avatar
    129 posts

    Posted 15 Jul 2010 Link to this post

    Hello Marcus Lambert,

    Yes. The event we introduced is called DocumentContentChanged. You can also configure the minimal time span between two subsequent calls to the event with the property DocumentContentChangedInterval. This way the event will be fired whenever the content is changed, but not more often than the specified interval.

    The DocumentContentChanged is most suitable when implementing auto-save or binding scenarios, which include import/export to other document formats. This way you can avoid calling export on every key-stroke.

    Sincerely yours,
    Alex
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  8. Artur
    Artur avatar
    19 posts
    Member since:
    Jul 2010

    Posted 21 Jul 2010 Link to this post

    Hi,

    Sorry to do this question again, but today i change the code to use the new event, but stil can't bind two diferent radRichTextBox (writing in one and automactly copy that text i wrote to the second). This is possible to do with only bindings?


    Thanks
  9. Alex
    Admin
    Alex avatar
    129 posts

    Posted 27 Jul 2010 Link to this post

    Hi Artur,

    In the current version of the RadRichTextBox there are some issues that make this feature very hard to implement. Fortunately we will be able to fix these issues for the SP1 release after just a few weeks. Then we will be able to provide a sample project with two RadRichTextBoxes with synchronized contents.

    Sincerely yours,
    Alex
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  10. Artur
    Artur avatar
    19 posts
    Member since:
    Jul 2010

    Posted 28 Jul 2010 Link to this post

    Thanks for the help, i will wait then!
  11. Kevin
    Kevin avatar
    31 posts
    Member since:
    Jan 2009

    Posted 09 Aug 2010 Link to this post

    Any update on this?
  12. Ivailo Karamanolev
    Admin
    Ivailo Karamanolev avatar
    276 posts

    Posted 10 Aug 2010 Link to this post

    Hello Kevin,

    We are glad to inform you that SP1 is on track and coming this week. It will ship with new functionality, allowing binding very easy and intuitive, to properties like Xaml and Html, including binding two RadRichTextBox-es together. You will be able to find more on that in the help articles when SP1 comes out. Feel free to contact us if you have any other questions.

    All the best,
    Ivailo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  13. Daniel Billingsley
    Daniel Billingsley avatar
    95 posts
    Member since:
    Apr 2010

    Posted 13 Aug 2010 Link to this post

    I installed Q2 2010 SP1 yesterday and I don't see the Xaml or Html properties or the DocumentContentChangedInterval property mentioned previously in this discussion.

    So, in order to bind to this control are we still having to roll our own dependency property?
  14. Ivailo Karamanolev
    Admin
    Ivailo Karamanolev avatar
    276 posts

    Posted 16 Aug 2010 Link to this post

    Hello Daniel Billingsley,

    Q2 2010 SP1 actually contains these properties, but may be you're looking for them in the wrong place. DocumentContentChangedInterval is found in RadDocument (RadRichTextBox.Document), Html you can find in HtmlDataProvider, Xaml: in XamlDataProvider. We have written a help article explaining how to use these data providers, however as it's very new, it still hasn't appeared in the help. I have attached a pdf file with the contents of the article.
    Let us know if you have further questions.

    Best wishes,
    Ivailo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  15. Daniel
    Daniel avatar
    1 posts
    Member since:
    Aug 2010

    Posted 26 Aug 2010 Link to this post

    Hi,
    Any update on how to Bind two RichTextBoxes?
  16. Ivailo Karamanolev
    Admin
    Ivailo Karamanolev avatar
    276 posts

    Posted 27 Aug 2010 Link to this post

    Hi Daniel,

    Here is the help article about data providers (which is now online): http://www.telerik.com/help/silverlight/radrichtextbox-how-to-binding-to-data-providers.html
    The same approach can be utilized in order to bind two RadRichTextBox-es together, here's some XAML on how exactly to do that (this lives inside a UserControl, I've ommited that for brevity)
    <!-- xmlns:telerikXaml="clr-namespace:Telerik.Windows.Documents.FormatProviders.Xaml;assembly=Telerik.Windows.Documents.FormatProviders.Xaml" -->
     
    <UserControl.Resources>
            <telerikXaml:XamlDataProvider x:Key="dataProvider1" RichTextBox="{Binding ElementName=richTextBox1}" />
            <telerikXaml:XamlDataProvider x:Key="dataProvider2" RichTextBox="{Binding ElementName=richTextBox2}" Xaml="{Binding Source={StaticResource dataProvider1}, Path=Xaml, Mode=TwoWay}" />
        </UserControl.Resources>
     
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <telerik:RadRichTextBox Grid.Row="0" Name="richTextBox1" />
            <telerik:RadRichTextBox Grid.Row="1" Name="richTextBox2" />
        </Grid>
    What this does is it creates to RadRichTextBox-es and two XamlDataProviders and binds the data providers to each other.

    Sincerely yours,
    Ivailo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  17. Todd
    Todd avatar
    5 posts
    Member since:
    Aug 2010

    Posted 27 Aug 2010 Link to this post

    Ivailo,

    The Telerik website shows how to bind a RichTextBox to a textbox via the xamlDataProvider and now you have posted how to bind a RichTextBox to a RichTextBox via the xamlDataProvider.  Neither example is really that useful in the real-world.

    How would someone bind the radRichTextBox, via the xamlDataProvider class, to a property of an object that was originally instantiated in the code-behind? (The binding can occur in the XAML declarative file or the code-behind, whichever is easier to show us.)

    For example, if I have an instantiated object in my code-behind named 'tasks' and this object has a string property named 'notes', how would I bind tasks.notes to my radRichTextBox via the xamlDataProvider?
  18. Ivailo Karamanolev
    Admin
    Ivailo Karamanolev avatar
    276 posts

    Posted 31 Aug 2010 Link to this post

    Hi Todd,

    The purpose these data providers (and XamlDataProvider in particular) is to suit for any scenario requiring XAML-only binding. A vivid example of this is using RIA Services and the MVVM model for creating applications. However, if you'd like to hook RadRichTextBox's contents to a code behind variable, you basically have two options:
    1. Mimic what the data provider does internally: hook to the RadRichTextBox.DocumentContentChanged event and in the handler use the XamlFormatProvider in order to update your code-behind object/variable.
    2. Create a XamlDataProvider and create a binding from code behind and bind that to your variable. Here's how to do that:
    XamlDataProvider dataProvider = new XamlDataProvider();
    dataProvider.RichTextBox = radRichTextBox;
    Binding xamlBinding = new Binding("MyProperty");
    xamlBinding.Source = MyObject;
    xamlBinding.Mode = BindingMode.TwoWay;
    BindingOperations.SetBinding(dataProvider, XamlDataProvider.XamlProperty, xamlBinding);
    However, there is one small caveat here - make sure to declare the XamlDataProvider in the control scope in order to keep a reference to it. Otherwise it may get garbage collected. Additionally, this way you may bind only to properties and not fields or static variables.
    It's up to you to pick whichever approach feels more natural to you.

    Sincerely yours,
    Ivailo
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  19. Marc Roussel
    Marc Roussel avatar
    429 posts
    Member since:
    Dec 2009

    Posted 13 Sep 2012 Link to this post

    I have the following code in order to remove the huge line spacing by default but when I have it, the wrap text is getting over the previous line see screenshot

    private void TxtDataProvider_SetupDocument(object sender, Telerik.Windows.Documents.FormatProviders.SetupDocumentEventArgs e)
    {
        e.Document.LineSpacing = .4;
    }

    Screenshot : http://sdrv.ms/QIcuYM
  20. Iva Toteva
    Admin
    Iva Toteva avatar
    1319 posts

    Posted 14 Sep 2012 Link to this post

    Hello Marc,

    The LineSpacing should not be set to a value smaller than 1. Using LineSpacing = 1 should produce the desired result - as smallest distance between the lines in the same paragraph. If set to a smaller value, the text will overlap.

    You can also check if the space you are trying to remove is not due to the ParagraphSpacingAfter - the space left between different paragraphs. Its default value is 9 pt and you can set it to any smaller value (0 pt. is also a valid value).

    Kind regards,
    Iva Toteva
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

  21. Marc Roussel
    Marc Roussel avatar
    429 posts
    Member since:
    Dec 2009

    Posted 14 Sep 2012 Link to this post

    So if I understand, each line we write in the editor is a paragraph ?

    As each time I press enter I have a huge gap between lines

    Line this message

    And this is not very elegant

    If you tell me that this is true then I'll use what you propose otherwise there's something else going on
  22. Iva Toteva
    Admin
    Iva Toteva avatar
    1319 posts

    Posted 17 Sep 2012 Link to this post

    Hi Marc,

    Each time you press Enter, a new paragraph is created - just like in MS Word. On the other hand, pressing Ctrl+Enter adds just a line break.

    When a line break is added, the paragraph is not split in two and the space between adjacent lines is determined by the LineSpacing property. The space between adjacent paragraphs, on the other hand, is controlled by the SpacingAfter property of the Paragraph or (if not set) by the ParagraphDefaultSpacingAfter of the document.

    In order to adjust the ParagraphSpacingAfter, you can set the ParagraphDefaultSpacingAfter property of the document to 0 in the handler of the SetupDocument event like this:

    void html_SetupDocument(object sender, Telerik.Windows.Documents.FormatProviders.SetupDocumentEventArgs e)
    {
        e.Document.ParagraphDefaultSpacingAfter = 0;
    }

    In this way, no additional space will be added between the paragraphs. You can additionally set the LineSpacing to 1 in the event, if you find the space between the lines of the same paragraph too big (the default value is 1.15).

    I hope this helps.

    Greetings,
    Iva Toteva
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

  23. Marc Roussel
    Marc Roussel avatar
    429 posts
    Member since:
    Dec 2009
Back to Top
DevCraft banner