MVVM with richtextbox

Question

Hello

I am implementing a richtextbox on my WPF, using MVVM, but I found that is very problematic, could somebody help me with MVVMFY, I also find out that WPF is very troublesome to work with, especially when you make dependency properties and user controls. You have to rebuild every time, so it can be aware of changes, which is a pain.

Anyway,

As I mentioned earlier, I do not know how to work with MVVM and the rich textbox

My app is almost finished, but I want to get rid of all my code behind, and put it in my view model

This is the UI for the notes Page

My VM for notes

  public ICommand ExitCommand { get; set; }
    public ICommand NewNotebookCommand { get; set; }
    public ICommand NewNoteCommand { get; set; }
    public ICommand RenameCommand { get; set; }
    public List FontSizes { get; set; }
    public IOrderedEnumerable fonts { get; set; }
    public ObservableCollection Notebooks { get; set; }
    public ObservableCollection Notes { get; set; }

    private Notebook _SelectedNoteBook;
    public Notebook SelectedNoteBook {
        get { return _SelectedNoteBook; }
        set {
            if (_SelectedNoteBook != value) {
                _SelectedNoteBook = value;
                RaisePropertyChanged();
                GetNotes();
            }
        }
    }


    private bool _IsVisible;
    public bool IsVisible {
        get { return _IsVisible; }
        set {
            if (_IsVisible != value) {
                _IsVisible = value;
                RaisePropertyChanged();
            }
        }
    }

    public NotesWindowVM() {

        IsVisible = false;
        Notes = new ObservableCollection();
        Notebooks = new ObservableCollection();
        fonts = Fonts.SystemFontFamilies.OrderBy(f => f.Source);
        FontSizes = new List();
        for (int i = 7; i < 72; i++) {
            FontSizes.Add(i);
        }
        RenameCommand = new Command(() => {
            IsVisible = true;
        });
        ExitCommand = new Command(() => {
            Application.Current.Shutdown();
        });
        NewNotebookCommand = new Command(() => {
            CreateNewNotebook();
        });
        NewNoteCommand = new HelperCommand {
            ExecuteDelegate = x => CreateNewNote(SelectedNoteBook.Id),
            CanExecuteDelegate = x => SelectedNoteBook != null
        };

        GetNoteBooks();
    }

    private void CreateNewNote(int NotebookId) {
        Note note = new() {
            NotebookId = NotebookId,
            CreatedAt = DateTime.Now,
            UpdatedAt = DateTime.Now,
            Title = "New Note"
        };
        Database.Insert(note);

        GetNotes();
    }

    private void CreateNewNotebook() {
        Notebook notebook = new() { Name = $"Notebook" };
        Database.Insert(notebook);

        GetNoteBooks();
    }

    private void GetNoteBooks() {

        var notebooks = Database.Read();

        Notebooks.Clear();
        foreach (var item in notebooks) {
            Notebooks.Add(item);
        }
    }

    private void GetNotes() {

        if (SelectedNoteBook != null) {
            var notes = Database.Read().Where(
                n => n.NotebookId == SelectedNoteBook.Id)
                .ToList();

            Notes.Clear();
            foreach (var item in notes) {
                Notes.Add(item);
            }
        }
    }
}

and I want to get rid of all this and implemented it on my VM

code-behind for notes

    public NotesWindow() {
        InitializeComponent();

        var speechRecognizer = SpeechConfig.FromSubscription(key, region);
        var audioConfig = AudioConfig.FromDefaultMicrophoneInput();
        recog = new SpeechRecognizer(speechRecognizer, audioConfig);

        recog.Recognized += SpeechRecognizer_Recognized;
    }
    private async void SpeechRecognizer_Recognized(object sender, SpeechRecognitionEventArgs e) {
        if (e.Result.Reason == ResultReason.RecognizedSpeech) {
            await Dispatcher.InvokeAsync(() => NoteContent.AppendText($"{e.Result.Text}"));

        }
    }

    private void NoteContent_TextChanged(object sender, TextChangedEventArgs e) {
        FlowDocument doc = NoteContent.Document;
        int count = new TextRange(doc.ContentStart, doc.ContentEnd).Text.Length;
        NumOfCharacters.Text = $"Characters: {count}";
    }

    private async void SpeechBton_Click(object sender, RoutedEventArgs e) {

        var toggle = sender as System.Windows.Controls.Primitives.ToggleButton;
        switch (toggle.Tag) {
            case "0":
                if (!isRecognizing) {
                    await recog.StartContinuousRecognitionAsync();

                    isRecognizing = true;
                    SpeechBton.IsChecked = true;
                } else {
                    await recog.StopContinuousRecognitionAsync();

                    isRecognizing = false;
                    SpeechBton.IsChecked = false;
                }
                break;
            case "1":
                bool isChecked = toggle.IsChecked ?? false;
                if (isChecked) {
                    NoteContent.Selection.ApplyPropertyValue(FontWeightProperty, FontWeights.Bold);
                } else {
                    NoteContent.Selection.ApplyPropertyValue(FontWeightProperty, FontWeights.Normal);
                }
                break;
            case "2":
                bool isEnable = toggle.IsChecked ?? false;
                if (isEnable) {
                    NoteContent.Selection.ApplyPropertyValue(FontStyleProperty, FontStyles.Italic);
                } else {
                    NoteContent.Selection.ApplyPropertyValue(FontStyleProperty, FontStyles.Normal);
                }
                break;
            case "3":
                bool isPressed = toggle.IsChecked ?? false;
                if (isPressed) {
                    NoteContent.Selection.ApplyPropertyValue(Inline.TextDecorationsProperty, TextDecorations.Underline);
                } else {

                    (NoteContent.Selection.GetPropertyValue(Inline.TextDecorationsProperty) as TextDecorationCollection)
                        .TryRemove(TextDecorations.Underline, out TextDecorationCollection decorations);
                    NoteContent.Selection.ApplyPropertyValue(Inline.TextDecorationsProperty, decorations);
                }
                break;
        }
    }

    private void NoteContent_SelectionChanged(object sender, RoutedEventArgs e) {

        var selectionFontWeight = NoteContent.Selection.GetPropertyValue(Inline.FontWeightProperty);
        boldBton.IsChecked = (selectionFontWeight != DependencyProperty.UnsetValue)
            && selectionFontWeight.Equals(FontWeights.Bold);

        var selectionFontStyle = NoteContent.Selection.GetPropertyValue(Inline.FontStyleProperty);
        italicBton.IsChecked = (selectionFontStyle != DependencyProperty.UnsetValue)
            && selectionFontStyle.Equals(FontStyles.Italic);

        var selectionFontDecoration = NoteContent.Selection.GetPropertyValue(Inline.TextDecorationsProperty);
        UndelineBton.IsChecked = (selectionFontDecoration != DependencyProperty.UnsetValue)
            && selectionFontDecoration.Equals(TextDecorations.Underline);

        FontsComboBox.SelectedItem = NoteContent.Selection.GetPropertyValue(FontFamilyProperty);
        SizeConboBox.Text = (NoteContent.Selection.GetPropertyValue(FontSizeProperty)).ToString();
    }

    private void FontsComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e) {
        if (FontsComboBox.SelectedItem != null) {
            NoteContent.Selection.ApplyPropertyValue(FontFamilyProperty, FontsComboBox.SelectedItem);
        }
    }

    private void SizeConboBox_SelectionChanged(object sender, SelectionChangedEventArgs e) {
        NoteContent.Selection.ApplyPropertyValue(FontSizeProperty, SizeConboBox.Text);
    }
}

}

Accepted Answer

I will show you a sample of RichTextBox with MVVM. Here is my code for you:
XAMl code:

RichTextBoxHelper.cs code:

using System;  
using System.Collections.Generic;  
using System.IO;  
using System.Text;  
using System.Threading;  
using System.Windows;  
using System.Windows.Controls;  
using System.Windows.Documents;  
using System.Windows.Markup;  
  
namespace RichTextBoxMVVM  
{  
    public class RichTextBoxHelper : DependencyObject  
    {  
        private static HashSet _recursionProtection = new HashSet();  
  
        public static string GetDocumentXaml(DependencyObject obj)  
        {  
            return (string)obj.GetValue(DocumentXamlProperty);  
        }  
  
        public static void SetDocumentXaml(DependencyObject obj, string value)  
        {  
            _recursionProtection.Add(Thread.CurrentThread);  
            obj.SetValue(DocumentXamlProperty, value);  
            _recursionProtection.Remove(Thread.CurrentThread);  
        }  
  
        public static readonly DependencyProperty DocumentXamlProperty = DependencyProperty.RegisterAttached(  
            "DocumentXaml",  
            typeof(string),  
            typeof(RichTextBoxHelper),  
            new FrameworkPropertyMetadata(  
                "",  
                FrameworkPropertyMetadataOptions.AffectsRender | FrameworkPropertyMetadataOptions.BindsTwoWayByDefault,  
                (obj, e) => {  
                    if (_recursionProtection.Contains(Thread.CurrentThread))  
                        return;  
  
                    var richTextBox = (RichTextBox)obj;  
                try  
                    {  
                        var stream = new MemoryStream(Encoding.UTF8.GetBytes(GetDocumentXaml(richTextBox)));  
                        var doc = (FlowDocument)XamlReader.Load(stream);  
  
                    richTextBox.Document = doc;  
                    }  
                    catch (Exception)  
                    {  
                        richTextBox.Document = new FlowDocument();  
                    }  
  
                richTextBox.TextChanged += (obj2, e2) =>  
                    {  
                        RichTextBox richTextBox2 = obj2 as RichTextBox;  
                        if (richTextBox2 != null)  
                        {  
                            SetDocumentXaml(richTextBox, XamlWriter.Save(richTextBox2.Document));  
                        }  
                    };  
                }  
            )  
        );  
    }  
}

ViewModel.cs and Model.cs code:

  public class ViewModel  
    {  
        public Model model { get; set; }  
  
        public ViewModel()  
        {  
            model = new Model()  
            {  
                ID = "001",  
                Name = "Daisy",  
                Description = "Hello, this is RichTextBox"  
            };  
        }  
    }  
  
    public class Model  
    {  
        public string ID { get; set; }  
        public string Name { get; set; }  
        public string Description { get; set; }  
    }

The result picture is:

By the way, you may need to improve the way you ask questions. It's better for you to make your question clear without excess irrelevant code, and it not a good way to ask multiple functions to be implemented on the one question. You could create a new question to ask your Speech problem.

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer

For the second part if you have set the Window DataContext you should be able to do this

Share via

MVVM with richtextbox

1 additional answer