Skip to main content

Implement Check-As-You-Type Mode in Text-Aware Controls

  • 3 minutes to read

This document contains instructions on how to implement check-as-you-type mode for the standalone SpellChecker component added to text-aware controls (TextEdit and MemoEdit).

Bind the SpellChecker Defined in Code-Behind

Implement a SpellChecker property to access the spell checker component. Set the data context to enable binding.

using System.Windows;
using System.Globalization;
using DevExpress.Xpf.SpellChecker;

namespace WpfApplication1
{
    public partial class MainWindow : Window
    {
        SpellChecker checker;

        public MainWindow()
        {
            DataContext = this;
            checker = new SpellChecker();
            InitializeComponent();
            SpellChecker = checker;
        }

        public SpellChecker SpellChecker
        {
            get { return checker; }
            private set { checker = value; }
        }
    }
}

In XAML, bind the SpellingSettings.SpellChecker property to the created SpellChecker property. Note that if the SpellingSettings.SpellChecker property is not specified, an internal spell checker is created. The internal spell checker uses SpellingSettings specified in XAML.

xmlns:dxspch="http://schemas.devexpress.com/winfx/2008/xaml/spellchecker"

<dxspch:SpellingSettings.SpellChecker>
    <Binding Path="SpellChecker"/>
</dxspch:SpellingSettings.SpellChecker>

Enable the Check-as-You-Type Mode

Set the SpellChecker.SpellCheckMode property to SpellCheckMode.AsYouType to enable check-as-you-type mode.

using DevExpress.Xpf.Core;
using DevExpress.Xpf.SpellChecker;
using DevExpress.XtraSpellChecker;
using System.Globalization;

public partial class MainWindow : Window
    {
        SpellChecker checker;

        public MainWindow()
        {
            DataContext = this;
            checker = new SpellChecker();
            InitializeComponent();
            checker.Culture = new CultureInfo("pl-PL");
            checker.SpellCheckMode = DevExpress.XtraSpellChecker.SpellCheckMode.AsYouType;
            SpellChecker = checker;
        }

        public SpellChecker SpellChecker
        {
            get { return checker; }
            private set { checker = value; }
        }

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            // Start checking the text within a text edit control.
            checker.Check(textEdit1);
        }
    }

Specify Spelling Settings in XAML

Specify the following values for the SpellingSettings attributes:

<dxspch:SpellingSettings.SpellChecker>
    <Binding Path="SpellChecker"/>
</dxspch:SpellingSettings.SpellChecker>
<dxspch:SpellingSettings.CheckAsYouType>True</dxspch:SpellingSettings.CheckAsYouType>
<dxspch:SpellingSettings.ShowSpellCheckMenu>True</dxspch:SpellingSettings.ShowSpellCheckMenu>
<dxspch:SpellingSettings.UnderlineColor>Blue</dxspch:SpellingSettings.UnderlineColor>
<dxspch:SpellingSettings.UnderlineStyle>WavyLine</dxspch:SpellingSettings.UnderlineStyle>

You can also use the SpellingSettings.DictionarySourceCollection property to add dictionaries to the spell checker. You can add a dictionary as shown in the following code:

<dxspch:SpellingSettings.DictionarySourceCollection>
    <dxspch:DictionarySourceCollection>
        <dxspch:SpellCheckerOpenOfficeDictionarySource Culture="pl-PL" 
                                                   DictionaryUri="pack://siteoforigin:,,,/Dictionaries/pl_PL.dic" 
                                                   GrammarUri="pack://siteoforigin:,,,/Dictionaries/pl_PL.aff"/>
    </dxspch:DictionarySourceCollection>
</dxspch:SpellingSettings.DictionarySourceCollection>

Run the Application

When SpellChecker encounters a word not found within dictionaries or a duplicate word, it marks it with a blue wavy line.

CheckAsYouType-Result

Right-click the misspelled word to invoke a menu where you can choose from suggested replacements or select other actions to handle the mistake.