Spell Checker Context Menu In Windows Store Apps

Introduction

Spell Checker is used to check the spelling of any word. We can apply the Spell Checker context menu in the TextBox and the RichEditBox. If we mis-spell anything that is not in the dictionary then when we right-click on the spelling mistake the Spell Checker context menu will appear showing all the possible correct spellings of that word and also an option for adding that word to the dictionary. The following image shows the simple Spell Checker context menu:



This can be done by using the IsSpellCheckEnabled property of TextBox and the RichaEditBox. If this property is set to true then the Spell Checker context menu will appear when we right-click on the incorrect spelling in the TextBox or the RichEditBox. To see how it works let's use the following.

Step 1

Open Visual Studio 2012 and click on "File" -> "New" -> "Project...".

Step 2

A window is shown. In it select Window Store inside the Visual C# template from the left pane and BlankPage from the center pane as:



Give the name of your application as "SpellChecker" and then click ok.

Step 3

Open the MainPage.xaml file.

Step 4

Write the following code in this MainPage.xaml file as:

<Page

    x:Class="SpellChecker.MainPage"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="using:SpellChecker"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    mc:Ignorable="d">

    <Grid>

        <Grid.Background>

            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                <GradientStop Color="Black"/>

                <GradientStop Color="#FFCFFDFD" Offset="1"/>

            </LinearGradientBrush>

        </Grid.Background>

        <Grid.RowDefinitions>

            <RowDefinition Height="50"/>

            <RowDefinition Height="100"/>

            <RowDefinition Height="100"/>

        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="500"/>

            <ColumnDefinition Width="600"/>

        </Grid.ColumnDefinitions>

        <TextBlock Text="Spell checker Context Menu In Windows Store apps" Grid.Row="0" Grid.Column="1" FontSize="20" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="10,10,0,0"/>

        <TextBlock Text="Spell Checker In TextBox" Grid.Row="1" Grid.Column="0" FontSize="20" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="125,38,143,38" Width="232"/>

        <TextBox Name="textbox1" Grid.Row="1" Grid.Column="1" FontSize="20" IsSpellCheckEnabled="True" Height="50" Margin="10,10,0,0"/>

        <TextBlock Text="Spell Checker In RichEditBox" Grid.Row="2" Grid.Column="0" FontSize="20" HorizontalAlignment="Center" VerticalAlignment="Center"/>

        <RichEditBox Name="richeditbox1" Grid.Row="2" Grid.Column="1" FontSize="20" IsSpellCheckEnabled="True"  Margin="10,10,0,0"/>

    </Grid>

</Page>

This code defines one TextBox and one RichEditBox in which I set the property IsSpellCheckEnabled to true so that the Spell Checker context menu will be displayed.

Step 5

Now run the application; the output looks like:



Enter any text in the TextBox. The Spell Checker will check the spelling and correct it.



Enter the text in the RichEditBox and the Spell Checker will do the same as:



Summary

In this article I explained how to show the Spell Checker Context menu in Windows Store Apps.