Syntax to send text to a RichTextBox

I have prepared the simple program below to illustrate the problem i am trying to solve.

(1) The program structure is as follows, following MVVM pattern:

(2) The output is as follows:

An input TextBox at the top of the page takes text input (InputText) from the user. Note that this is a proxy for formatted text that would originate from a database.
The code automatically pastes the InputText into the the UserControl with the two TextBox's (middle of the window) using a normal MVVM Binding. This works fine.
I am failing to understand how to get the InputText to display in the bottom UserControl comprised of two RichTextBoxes. The reason the bottom UserControl contains two RichTextBoxes is i would like to understand how to refer to one of the RichTextBoxes in the UserControl by its name.
The code is obviously a bit silly, but only meant to illustrate the problem with minimal overhead.
I think i have the right building blocks based on looking at many examples, but i am stuck in terms of where to locate and use the Method that sends the text to the RichTextBox, either the static one in RichTextBoxModels or the non static one in the MyTwoRichTexTBoxUserControl code behind. The idea is that either of these methods would be called in the MainWindowViewModel InputText Set Property Code.

(3) The code is as follows (and attached):
MainWindowView.xaml

"SimpleExample.Views.MainWindowView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SimpleExample.Views"
xmlns:viewmodels="clr-namespace:SimpleExample.ViewModels"
xmlns:usercontrols="clr-namespace:SimpleExample.UserControls"
mc:Ignorable="d"
Title="MainWindowView" Height="450" Width="800">
"*" />
"2*" />
"*" />
"2" />
"2*" />
"2" />
"2*" />
"Input Text:"
Background="LightGray"
Grid.Row="0" Grid.Column="0" Margin="10" VerticalAlignment="Center"
TextAlignment="Right" Padding="5"
FontSize="30"/>
"{Binding InputText, UpdateSourceTrigger=PropertyChanged}"
Grid.Row="0" Grid.Column="1" Margin="10" VerticalAlignment="Center"
TextAlignment="Left" Padding="5"
FontSize="30"/>
"1" Grid.ColumnSpan="2" StrokeThickness="1" Fill="Gray" />
"Output to My Two TextBox UserControl"
Background="LightGray"
Grid.Row="2" Grid.Column="0" Margin="10" VerticalAlignment="Center"
TextAlignment="Right" TextWrapping="Wrap" Padding="5"
FontSize="30"/>
"{Binding}" Grid.Row="2" Grid.Column="1"/>
"3" Grid.ColumnSpan="2" StrokeThickness="1" Fill="Gray" />
"Output to My Two RichTextBox UserControl"
Background="LightGray"
Grid.Row="4" Grid.Column="0" Margin="10" VerticalAlignment="Center"
TextAlignment="Right" TextWrapping="Wrap" Padding="5"
FontSize="30"/>
"{Binding}" Grid.Row="4" Grid.Column="1"/>

MainWindowView.xaml.cs

using System.Windows;
namespace SimpleExample.Views
{
///
/// Interaction logic for MainWindowView.xaml
///
public partial class MainWindowView : Window
{
public MainWindowView()
{
InitializeComponent();
}
}
}

MainWindowViewModel.cs

using SimpleExample.Interfaces;
namespace SimpleExample.ViewModels
{
public class MainWindowViewModel : ObservableObject
{
#region Fields
private string _inputText;
#endregion Fields
#region Properties
public string InputText
{
get { return _inputText; }
set
{
_inputText = value;
OnPropertyChanged("InputText");
// ONE OF THE TWO METHODS TO SEND THE INPUTTEXT TO THE RICHTEXTBOX WOULD GO HERE
}
}
#endregion Properties
}
}

MyTwoTextBoxUserControl.xaml

"SimpleExample.UserControls.MyTwoTextBoxUserControl"
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:local="clr-namespace:SimpleExample.UserControls"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
"*"/>
"*"/>
"{Binding InputText}"
TextAlignment="Left" VerticalContentAlignment="Center" FontSize="30"
Grid.Row="0" Margin="10" Padding="5"/>
"{Binding InputText}"
TextAlignment="Left" VerticalContentAlignment="Center" FontSize="30"
Grid.Row="1" Margin="10" Padding="5"/>

MyTwoTextBoxUserControl.xaml.cs

using System.Windows.Controls;
namespace SimpleExample.UserControls
{
///
/// Interaction logic for MyTextBoxUserControl.xaml
///
public partial class MyTwoTextBoxUserControl : UserControl
{
public MyTwoTextBoxUserControl()
{
InitializeComponent();
}
}
}

MyTwoRichTextBoxUserControl.xaml

"SimpleExample.UserControls.MyTwoRichTextBoxUserControl"
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:local="clr-namespace:SimpleExample.UserControls"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
"*"/>
"*"/>
x:Name="RTBTop"
Grid.Row="0" Margin="10" Padding="5"
VerticalContentAlignment="Center" FontSize="30"/>
x:Name="RTBBottom"
Grid.Row="1" Margin="10" Padding="5"
VerticalContentAlignment="Center" FontSize="30"/>

MyTwoRichTextBoxUserControl.xaml.cs

using System.IO;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
namespace SimpleExample.UserControls
{
///
/// Interaction logic for MyRichTextBoxUserControl.xaml
///
public partial class MyTwoRichTextBoxUserControl : UserControl
{
public MyTwoRichTextBoxUserControl()
{
InitializeComponent();
}
// IS THIS THE RIGHT PLACE TO PUT THIS CODE???
public void ShowTextInRTBUserControl_USING_CODE_BEHIND(string textString)
{
byte[] byteArray = Encoding.ASCII.GetBytes(textString);
using (MemoryStream ms = new MemoryStream(byteArray))
{
TextRange tr = new TextRange(RTBBottom.Document.ContentStart, RTBBottom.Document.ContentEnd);
tr.Load(ms, DataFormats.Rtf);
}
}
}
}

RichTextBoxModels.cs

using System.IO;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
namespace SimpleExample.Models
{
public static class RichTextBoxModels
{
// IS THIS THE RIGHT PLACE TO USE THIS CODE???
public static void ShowTextInRTBUserControl_USING_STATIC_METHOD(string textString, RichTextBox rtb)
{
byte[] byteArray = Encoding.ASCII.GetBytes(textString);
using (MemoryStream ms = new MemoryStream(byteArray))
{
TextRange tr = new TextRange(rtb.Document.ContentStart, rtb.Document.ContentEnd);
tr.Load(ms, DataFormats.Rtf);
}
}
}
}

ObservableObject.cs

using System.ComponentModel;
namespace SimpleExample.Interfaces
{
///
/// Implements INotifyPropertyChanged event
///
public class ObservableObject : INotifyPropertyChanged
{
#region Fields
public event PropertyChangedEventHandler PropertyChanged;
#endregion
#region Methods
protected void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
#endregion
}
}

Question

I don't understand how to use the standard public static void method

ShowTextInRTBUserControl_USING_STATIC_METHOD: how do i call this method in the InputText Set property of the MainWindowViewmodel in terms of specifiying in which RichTextBox i want the InputText to be displayed. If I give the name of the RichTextBox "RTBBottom", it is not recognized.

If i use the similar non-static method in the code-behind MyTwoRichTextBoxUserControl.xaml.cs, then i can specify the bottom RichTextBox by its name, but cannot call the method from the MainWindowViewModel InputText Set property.

Is there a way to setup a binding as one would do with a TextBox.

I am sure i am missing something basic - sorry for this. Appreciate any help.

Create a two depandancy properties for your user control (MyTwoRichTextBoxUserControl) . I have upload the solution back. download and run it.

Chages are:

In MyTwoRichTextBoxUserControl.xaml.cs

public partial class MyTwoRichTextBoxUserControl : UserControl
{
public MyTwoRichTextBoxUserControl()
{
InitializeComponent();
}
public string BottomValue
{
get { return (string)GetValue(BottomValueProperty); }
set { SetValue(BottomValueProperty, value); }
}
// Using a DependencyProperty as the backing store for TopValue. This enables animation, styling, binding, etc...
public static readonly DependencyProperty BottomValueProperty =
DependencyProperty.Register("BottomValue", typeof(string), typeof(MyTwoRichTextBoxUserControl), new PropertyMetadata(onBottomValuePropertyChange));
private static void onBottomValuePropertyChange(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
MyTwoRichTextBoxUserControl ctrl = d as MyTwoRichTextBoxUserControl;
ShowTextInRTBUserControl_USING_CODE_BEHIND((string)e.NewValue, ctrl.RTBBottom);
}
public string TopValue
{
get { return (string)GetValue(TopValueProperty); }
set { SetValue(TopValueProperty, value); }
}
// Using a DependencyProperty as the backing store for TopValue. This enables animation, styling, binding, etc...
public static readonly DependencyProperty TopValueProperty =
DependencyProperty.Register("TopValue", typeof(string), typeof(MyTwoRichTextBoxUserControl), new PropertyMetadata(onPropertyChange));
private static void onPropertyChange(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
MyTwoRichTextBoxUserControl ctrl = d as MyTwoRichTextBoxUserControl;
ShowTextInRTBUserControl_USING_CODE_BEHIND((string)e.NewValue, ctrl.RTBTop);
}
private static void ShowTextInRTBUserControl_USING_CODE_BEHIND(string textString, RichTextBox rtb) // IS THIS THE RIGHT PLACE TO PUT THIS CODE???
{
if(string.IsNullOrEmpty(textString))
{
return;
}
// Source: https://stackoverflow.com/questions/15983278/storing-data-of-rich-text-box-to-database-with-formatting
byte[] byteArray = Encoding.ASCII.GetBytes(textString);
using (MemoryStream ms = new MemoryStream(byteArray))
{
TextRange tr = new TextRange(rtb.Document.ContentStart, rtb.Document.ContentEnd);
tr.Load(ms, DataFormats.Rtf);
}
}
}

In MainWindowView.xaml

<usercontrols:MyTwoRichTextBoxUserControl TopValue="{Binding InputText, UpdateSourceTrigger=PropertyChanged}" BottomValue="{Binding InputText, UpdateSourceTrigger=PropertyChanged}" Grid.Row="4" Grid.Column="1"/>

3 Replies

Know the answer? Post it — somebody with the same question will find it here.

Avnish Kumar6y ago
I think,During changes you might have change in name of method "homShowTextInRTBUserControl_USING_CODE_BEHIND" Upload the code again for better solution.
Ethan Young6y ago
Thank you so much Avnish for taking the time to review my code. I will review your solution closely. Note that when i ran your updated code, upon typing text in the input field, i got the following error:

Severity Code Description Project File Line Suppression State
Error CS0103 The name 'homShowTextInRTBUserControl_USING_CODE_BEHIND' does not exist in the current context SimpleExample

Do you have any idea how to resolve.

Thanks again.
Avnish Kumar6y ago
Create a two depandancy properties for your user control (MyTwoRichTextBoxUserControl) . I have upload the solution back. download and run it.
Chages are:
In MyTwoRichTextBoxUserControl.xaml.cs
public partial class MyTwoRichTextBoxUserControl : UserControl
{
     public MyTwoRichTextBoxUserControl()
     {
         InitializeComponent();

     }


     public string BottomValue
     {
         get { return (string)GetValue(BottomValueProperty); }
         set { SetValue(BottomValueProperty, value); }
     }

     // Using a DependencyProperty as the backing store for TopValue.  This enables animation, styling, binding, etc...
     public static readonly DependencyProperty BottomValueProperty =
         DependencyProperty.Register("BottomValue", typeof(string), typeof(MyTwoRichTextBoxUserControl), new PropertyMetadata(onBottomValuePropertyChange));

     private static void onBottomValuePropertyChange(DependencyObject d, DependencyPropertyChangedEventArgs e)
     {
         MyTwoRichTextBoxUserControl ctrl = d as MyTwoRichTextBoxUserControl;
         ShowTextInRTBUserControl_USING_CODE_BEHIND((string)e.NewValue, ctrl.RTBBottom);
     }



     public string TopValue
     {
         get { return (string)GetValue(TopValueProperty); }
         set { SetValue(TopValueProperty, value); }
     }

     // Using a DependencyProperty as the backing store for TopValue.  This enables animation, styling, binding, etc...
     public static readonly DependencyProperty TopValueProperty =
         DependencyProperty.Register("TopValue", typeof(string), typeof(MyTwoRichTextBoxUserControl), new PropertyMetadata(onPropertyChange));

     private static void onPropertyChange(DependencyObject d, DependencyPropertyChangedEventArgs e)
     {
         MyTwoRichTextBoxUserControl ctrl = d as MyTwoRichTextBoxUserControl;
         ShowTextInRTBUserControl_USING_CODE_BEHIND((string)e.NewValue, ctrl.RTBTop);

     }


     private static void ShowTextInRTBUserControl_USING_CODE_BEHIND(string textString, RichTextBox rtb) // IS THIS THE RIGHT PLACE TO PUT THIS CODE???
     {
         if(string.IsNullOrEmpty(textString))
         {
             return;
         }
         // Source: https://stackoverflow.com/questions/15983278/storing-data-of-rich-text-box-to-database-with-formatting
         byte[] byteArray = Encoding.ASCII.GetBytes(textString);
         using (MemoryStream ms = new MemoryStream(byteArray))
         {
             TextRange tr = new TextRange(rtb.Document.ContentStart, rtb.Document.ContentEnd);
             tr.Load(ms, DataFormats.Rtf);
         }
     }
}
In MainWindowView.xaml
<usercontrols:MyTwoRichTextBoxUserControl TopValue="{Binding InputText, UpdateSourceTrigger=PropertyChanged}" BottomValue="{Binding InputText, UpdateSourceTrigger=PropertyChanged}" Grid.Row="4" Grid.Column="1"/>