SpeechRecognizerUx class


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

public partial class SpeechRecognizerUx
<sp:SpeechRecognizerUx />

The SpeechRecognizerUx class has the following members.




Initializes a new instance of the SpeechRecognizerUx class.




A list of suggestions from the application developer, to be displayed at random in the Tips area of the SpeechRecognizerUx.


The SpeechRecognizer instance that the SpeechRecognizerUx acts on.

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.


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">
<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" />

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.


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

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

    // Start speech recognition.
    var resultText = document.getElementById('ResultText');
                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.


Minimum Supported Client

Windows 8

Required Extensions