Make ASP.NET Speak Typed Text
Introduction
One particular thing about most websites on the internet is that they are all silent! I mean they do not have the capability to talk to you :) You will understand as you read on... One of the advantages if your website is Speech-enabled is that the users will not fix the screen and read whatever is written. They can now hear what has been written on the page. Also, it adds that little bit which makes it not like other formal and tradition websites. This article shows you how easy it is to allow your website to talk back to the user! We will make use of the Microsoft's Speech API (SAPI) to give our website such a power.
Getting Started with Microsoft's Speech API (SAPI)
SAPI has a text-to-speech engine (TTS) that we will make use of. In short, SAPI takes text as input and output an audible speech using TTS engine. By the way, every machine with Windows XP has SAPI and TTS.
SAPI is a COM component that needs to be referenced in the project.
Coding Voice Application
First of all, open Microsoft Visual Web Developer and create a new Website. Use the Visual Basic as language. Add a reference to your project. Website > Add Reference > COM > Microsoft Speech Object Library.
Image 1: Interop.SpeechLib.dll added to project
Now throw in a text box and a button on your webpage. It may look as below.
Image 2: Webpage containing a Multiline textbox and a button
The scenario we want to do is to make the computer speak what has been written in the textbox by clicking on the "Speak" button. Double-click on the button to add some code for the button. To access the DLL function, we have to import the namespace SpeechLib as below:
Imports SpeechLib
The next step is to create a SpVoice object.
Dim voice As New SpVoice()
And finally, you can make the computer speak for you!
voice.Speak(txtSpeech.Text)
Et voila! Oh, don't forget to switch on your speakers. Type in a text in the textbox and click on the Speak button. You should hear someone speaking.
Below is the complete little code snippet. By the way, always place your code in a Try..Catch block. Make this as a habit.
Imports
SpeechLib
Partial
Class _Default
Inherits System.Web.UI.Page
Protected Sub
btnSpeak_Click(ByVal sender
As Object,
ByVal e As
System.EventArgs) Handles btnSpeak.Click
Try
Dim voice
As New SpVoice() '
Creates the voice object
voice.Speak(txtSpeech.Text)
' Speak whatever is written in the textbox
Catch ex As
Exception
Throw ex
End
Try
End
Sub
End
Class
Now, you can play around with the voice object by exploring the different methods and properties that the voice object can expose.
Set of methods of the voice object
For instance, to speed up the rate at which the speaker talks, we can do:
voice.Rate = 10
A Little Bit of Fun
Now let us try to build a simple application from what we have learnt. We will make an application that makes us guess a number between 1 and 10 and making the computer as the jury. The computer will speak out whether the number we have input is too high, too low or correct. Firstly, create a new Website on ASP.NET web developer and build a simple interface like below.
Image 3: User interface
Also, include a label, name it as lblGuessedNumber and make it as invisible. This will store a randomly generated number.
Add the Speech Object Library Object as reference.
To generate a random number, we make use of the Random class. On Page_Load event we place the following code snippet.
Protected Sub
Page_Load(ByVal sender
As Object, ByVal
e As System.EventArgs)
Handles
Try
If Not
IsPostBack() Then
Dim number
As
Integer
Dim rnd
As New Random()
' Random number generator
number = rnd.Next(1, 10)
' Generates random number between 1 and 10
' Storing the
random number in the hidden label
lblGuessedNumber.Text = number
End
If
Catch ex As
Exception
Throw ex
End
Try
End
Sub
Notice that the code is placed inside the Not IsPostBack() if statement as we do not want to generate a random number on every postback. Now, to validate the number that the user has input, we will make use of the following code snippet in the button's click event.
Protected Sub
btnGuess_Click(ByVal sender
As Object,
ByVal e As
System.EventArgs) Handles btnGuess.Click
Try
' Variables
declaration
Dim voice
As New SpVoice
Dim userNumber
As
Integer
Dim computerNumber
As
Integer
' Parse the
numbers and store then in integer variables
userNumber = Integer.Parse(txtNumber.Text)
computerNumber = Integer.Parse(lblGuessedNumber.Text)
' Speak the
verdict
If (userNumber < computerNumber)
Then
voice.Speak(txtNumber.Text & " is too
low!")
ElseIf (userNumber > computerNumber)
Then
voice.Speak(txtNumber.Text & " is too
high!")
Else
voice.Speak("Cool man! You guessed
the correct number!")
End
If
Catch ex As
Exception
Throw ex
End
Try
End
Sub
The basic idea behind is to first parse the number in integer formats so that we can get a proper and clean comparison :)
Then you can output whatever you want based on the comparison using the voice object.
Also, it is interesting to note that the SpVoice class is intelligent enough to interpret and say the numbers. You can try out with negatives as well.
That was just an example to show you how the TTS engine can be beautifully integrated into applications. It can really give it another dimension and another feeling. Now, it is up to you to be creative and develop your own stuffs. Sample applications you can develop include: mail notifications, desktop alerts, welcoming messages etc... Note that the same techniques can be very well applied to .NET Windows application. The same class can be used.
The TTS engine is unfortunately under-used! However, really cool thing can still be done with it. Go and express yourself on the TTS engine!
Please note that the sources for the "Guess number Website" can be found zipped here
Related articles:
1. Build Notepad ASP.NET Web Application
2. Build Notepad ASP.NET Web Application - part 2 of 2
3. Build a Poll System in ASP.NET
4. Building a Shopping List
5. E-Mail in ASP.NET
6. CAPTCHA - prevent bots and automatic submissions in ASP.NET
