Creating a Simple Text to Speech App - Page 1
       by kirupa  |  20 August 2007

In the previous page, you tied your button's Click event to an event handler called Speak. With that under-the-hood work out of the way, let's focus on adding the code to make our application speak.

Adding Text-To-Speech Functionality
Since a large part of this tutorial is getting the existing text-to-speech functionality to work, you only have to add a few lines of code. Unlike previous tutorials where you could just copy and paste the code, resolve any missing namespaces, and test your application, this time around you have an extra step - adding a reference to the namespace that contains the Speech classes.

To see what I mean, replace all of the code found inside your namespace ItSpeaks section with the following:

public partial class Window1

{

private SpeechSynthesizer speech;

 

public Window1()

{

this.InitializeComponent();

 

// Insert code required on object creation below this point.

speech = new SpeechSynthesizer();

}

 

private void Speak(object sender, System.Windows.RoutedEventArgs e)

{

// Speak

speech.SpeakAsync(textToSpeech.Text);

 

// 0 to 100

speech.Volume = 100;

 

// -10 to 10

speech.Rate = -2;

}

}

Try building your application after having copied and pasted the above code. When you try to build, you will receive the following error: The type or namespace name 'SpeechSynthesizer' could not be found (are you missing a using directive or an assembly reference?):

[ you will receiving a missing reference error ]

Normally, you can just right click on your SpeechSynthesizer class, find the Resolve sub-menu, and add your missing namespace. When you try that, though, you are in for a bit of a surprise:

[ oh no - there is no Resolve sub-menu ]

Notice that there is no Resolve menu! In situations like this, you'll need to add a reference to the namespaces that contain the class you are looking for. That isn't overly difficult. The easiest way to determine which class SpeechSynthesizer belongs to is by searching MSDN (the huge MS repository of programming information) for SpeechSynthesizer.

In my search attempt, the very first result provided the information I needed:

[ the MSDN search results for our SpeechSynthesizer query ]

Notice that the SpeechSynthesizer Class is located in System.Speech.Synthesis namespace inside the System.Speech's system.speech.dll assembly. With this information, you can discern that you need to add a reference to something that contains System.Speech.

To add a reference, locate your Solution Explorer in your Visual Studio / Visual C# window. Find the References folder, right-click on it, and select Add Reference:

[ right click on the References folder and select the Add Reference menu item ]

Once you have selected Add Reference, the Add Reference window will appear. Click on the .NET tab and use the scrollbar to find the component named System.Speech:

[ add the System.Speech component from the Add Reference window ]

Once you have found and selected the System.Speech component, press OK. Your Add Reference window will disappear, and you will find that your Reference folder in your Solution now includes a reference to System.Speech:

[ System.Speech now appears among your References ]

Simply ensuring your System.Speech reference is added is not enough. You need to tell your code to use it. In Window1.xaml.cs - the file that should already been open, find the list of using statements towards the top of your code:

[ your current collection of using statements ]

It's time to add another using statement. Anywhere in that list, create a new line and type using System.Speech. By doing this, you ensure that your code will use the System.Speech namespace.

With your System.Speech namespace now recognized, in your code, right click on any instance of your SpeechSynthesizer text. Unlike before where you only saw the Refactor sub-menu, this time you will also see the Resolve sub-menu appear:

Use the Resolve menu and select the System.Speech.Synthesis path. If you try to build your project now, you should not receive an error. When you test your application, enter some text, and press the Speak button, you will hear what you wrote:

[ enter some text and click on the Speak button to hear text read aloud ]

We are almost done with the tutorial now. There is just one minor usability feature that we need to implement. In this application, to hear what you wrote, you need to use your mouse and click on the Speak button. Wouldn't it be more natural to simply use the Enter button after typing your text? I think so. Let's implement that feature in the next section.

Enter Button Functionality - IsDefault
There are several ways to implement playing back the text using the Enter button. The most common approach, the one you are probably most familiar with if you have a background in other language, is where you have a listener that detects when the Enter key on your keyboard was pressed. Once the listener detects the event, it will call the appropriate method to deal with the Enter key press. In WPF, there is an easier way when you have just one button.

In WPF, buttons have a property known as IsDefault. The IsDefault property allows you to call a button by simply pressing the Enter key. That is just what we want for our application, so let's set our Speak button's IsDefault property to true.

To do that, go back to Blend. Select your Speak button and make sure your button's properties are displayed by clicking on the Properties button:

[ click on the Properties button to access your button's properties ]

Under your button's properties, find the Common Properties panel. Contained in the Common Properties panel will be the IsDefault checkbox. Once you have found the IsDefault checkbox, click on it to check it:

[ check the IsDefault checkbox to set the property to true ]

If you test your application again, type a few words and press Enter. After you press Enter, you will hear your text played back audibly. Best of all, you didn't have to move your hand away from your keyboard to use the mouse to click on the Speak button like you had to earlier.

1 | 2 | 3 | 4 | 5