SpeechRecognizerUx class

 

The SpeechRecognizerUx class is a control that you can drop into a XAML or HTML page to display speech recognition UI.

Syntax

public partial class SpeechRecognizerUx

<sp:SpeechRecognizerUx />

<div data-win-control="BingWinJS.SpeechRecognizerUx" />

The SpeechRecognizerUx class has the following members.

Constructors

Name	Description
SpeechRecognizerUx()	Initializes a new instance of the SpeechRecognizerUx class.

Properties

Name	Description
Tips	A list of suggestions from the application developer, to be displayed at random in the Tips area of the SpeechRecognizerUx.
SpeechRecognizer	The SpeechRecognizer instance that the SpeechRecognizerUx acts on.

Remarks

By default, the SpeechRecognizerUx control is hidden until the SpeechRecognizer.RecognizeSpeechToTextAsync() method is called, starting the speech recognition session. The SpeechRecognizerUx control then becomes visible, and displays the following control UI.

• A Go button that calls the SpeechRecognizer.StopListeningAndProcessAudio() method, which cuts off speech input and starts interpreting what has already been said. The Go button is available when the speech recognition session is in the "Listening" state.

• A Cancel button that calls the SpeechRecognizer.RequestCancelOperation() method, which ends the speech recognition session and collapses the control. Clicking or tapping outside of the control also calls the RequestCancelOperation() method. The Cancel button replaces the Go button when the speech recognition session moves from "Listening" to "Thinking".

• A volume animation to display the current volume level while the user is speaking.

• Intermediate results, displayed in the left portion of the control when the user is speaking.

• A text scramble animation to indicate when speech input is being interpreted.

Example

The following example creates a microphone button, a SpeechRecognizerUx control, and a results TextBlock in the markup page. Then, in the code behind, it creates a SpeechRecognizer instance, binds the SpeechRecognizerUx control to it, and provides a simple handler for the click event of the microphone button.

<!-- If your app target Windows 8.1, use this markup -->
<AppBarButton x:Name="SpeakButton" Icon="Microphone" Click="SpeakButton_Click">
</AppBarButton>
<TextBlock x:Name="TextResults" />
<sp:SpeechRecognizerUx x:Name="SpeechControl" />

<!-- If your app targets Windows 8, use this markup. -->
<Button x:Name="SpeakButton" Click="SpeakButton_Click" 
  Style="{StaticResource MicrophoneAppBarButtonStyle}" 
  AutomationProperties.Name="" />
<sp:SpeechRecognizerUx x:Name="SpeechControl" />
<TextBlock x:Name="ResultText" />

<div id="SpeakButton" onclick="speakButton_Click();" 
    style="font-size:30pt">&#xe1d6;</div>
<div id="SpeechControl"
    data-win-control="BingWinJS.SpeechRecognizerUx">
<div id="ResultText"></div>

The XAML AppBarButton element is only supported in Windows 8.1 or higher. To create a microphone button in Windows 8, you can use the MicrophoneAppBarButtonStyle, but you must first uncomment the style definition in StandardStyles.xaml. For more information, see How to: Add the Bing Speech Recognition Control to an application with the SpeechRecognizerUx class.

Example

public MainPage()
{
    this.InitializeComponent();
    this.Loaded += MainPage_Loaded;
}

SpeechRecognizer SR;
private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
    // Apply credentials from the Windows Azure Data Marketplace.
    var credentials = new SpeechAuthorizationParameters();
    credentials.ClientId = "<YOUR CLIENT ID>";
    credentials.ClientSecret = "<YOUR CLIENT SECRET>";

    // Initialize the speech recognizer and attach to control.
    SR = new SpeechRecognizer("en-US", credentials);
    SpeechControl.SpeechRecognizer = SR;
}

private async void SpeakButton_Click(object sender, RoutedEventArgs e)
{
    try
    {
        // Start speech recognition.
        var result = await SR.RecognizeSpeechToTextAsync();
        ResultText.Text = result.Text;
    }
    catch (System.Exception ex)
    {
        ResultText.Text = ex.Message;
    }
}

function Body_OnLoad() {
    // Apply credentials from the Windows Azure Data Marketplace.
    var credentials = new Bing.Speech.SpeechAuthorizationParameters();
    credentials.clientId = "<YOUR CLIENT ID>";
    credentials.clientSecret = "<YOUR CLIENT SECRET>";

    // Initialize the speech recognizer.
    var SR = new Bing.Speech.SpeechRecognizer("en-US", credentials);

    // Activate the Speech Control in WinJS
    WinJS.UI.process(speechControl);
}

function speakButton_Click() {
    // Bind the control to the SpeechRecognizer.
    document.getElementById('SpeechControl').winControl.speechRecognizer = SR;

    // Start speech recognition.
    var resultText = document.getElementById('ResultText');
    SR.recognizeSpeechToTextAsync()
            .then(
                function (result) {
                    if (typeof (result.text) == "string") {
                        resultText.innerHTML = result.text;
                    }
                },
                function (error) {
                    resultText.innerHTML = error.message;
                })
}

When working with the SpeechRecognizerUx control in JavaScript, you must bind the control to the SpeechRecognizer in the local scope before calling RecognizeSpeechToTextAsync.

Requirements

Minimum Supported Client	Windows 8
Required Extensions	Bing.Speech
Namespace	Bing.Speech.Xaml