Speech Recognition UI Settings

Introduction

This article explains the settings related to the speech recognizer UI. In my last article I explained how to integrate the default speech recognition UI in our App. Now in this article we will see the various settings that we use to customize that UI. So let's start.

Speech Recognition UI Settings

The default UI Speech recognizer supports the following settings:

1. Example Text
   
   It's a sample text that is shown on the listening page of the recognizer.
   
   [SpeechRecognizerUI Object name].Settings.ExampleText="Custom text here"
    
2. Listen Text
   
   This is a heading text that is displayed just above the example text in Listening page.
   
   [SpeechRecognizerUI Object name].Settings.ListenText="Custom text here"
    
3. Readout Enable
   
   This property sets whether or not the successfully recognized text is to be spoken back to the user on the confirmation page.
   
   [SpeechRecognizerUI Object name].Settings.ReadoutEnabled=True or False
    
4. Show Confirmation
   
   This setting is related to the confirmation page. If it's set to true then it will show the confirmation page on successful recognition. If it's set to false then the confirmation page is skipped and the recognized result is returned without user confirmation.
   
   [SpeechRecognizerUI Object name].Settings.ShowConfirmation=True or False
    

Settings Demo

The following code demonstrates the speech recognizer UI settings:

XAML

<phone:PhoneApplicationPage

    x:Class="Demo.MainPage"

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

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

    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"

    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"

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

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

    mc:Ignorable="d"

    FontFamily="{StaticResource PhoneFontFamilyNormal}"

    FontSize="{StaticResource PhoneFontSizeNormal}"

    Foreground="{StaticResource PhoneForegroundBrush}"

    SupportedOrientations="Portrait" Orientation="Portrait"

    shell:SystemTray.IsVisible="True">

 

    <!--LayoutRoot is the root grid where all page content is placed-->

    <Grid x:Name="LayoutRoot" Background="Transparent">

        <Grid.RowDefinitions>

            <RowDefinition Height="Auto"/>

            <RowDefinition Height="*"/>

        </Grid.RowDefinitions>

 

        <!--TitlePanel contains the name of the application and page title-->

        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">

            <TextBlock Text="Demo" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>

            <TextBlock Text="Settings Demo" Margin="9,-7,0,0" FontSize="40"/>

        </StackPanel>

 

        <!--ContentPanel - place additional content here-->

        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

            <Button Name="startBtn" Content="Start" Click="strtClick" HorizontalAlignment="Left" Margin="10,0,0,10" Width="446" Height="72" VerticalAlignment="Bottom"/>

            <TextBox Name="listTxt" HorizontalAlignment="Left" Height="72" Margin="0,134,0,0" TextWrapping="Wrap" Text="Listen Text" VerticalAlignment="Top" Width="456"/>

            <CheckBox Name="shwConf" Content="Show Confirmation" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,276,0,0" Width="436"/>

            <TextBox Name="exTxt" Height="72" Margin="0,10,0,0" TextWrapping="Wrap" Text="Example Text" VerticalAlignment="Top" HorizontalAlignment="Left" Width="456" />

            <CheckBox Name="readEnab" Content="Readout Enable" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,401,0,0" Width="436"/>

        </Grid>

    </Grid>

 

</phone:PhoneApplicationPage>

C# Code Behind

using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Navigation;

using Microsoft.Phone.Controls;

using Microsoft.Phone.Shell;

using Demo.Resources;

using System.Threading;

using Windows.Phone.Speech.Recognition;

 

namespace Demo

{

    public partial class MainPage : PhoneApplicationPage

    {

        // Constructor

        public MainPage()

        {

            InitializeComponent();

        }

   

        private async void strtClick(object sender, RoutedEventArgs e)

        {

            SpeechRecognizerUI mic = new SpeechRecognizerUI();

            mic.Settings.ExampleText = exTxt.Text;

            mic.Settings.ListenText = listTxt.Text;

            mic.Settings.ReadoutEnabled = readEnab.IsChecked.Value;

            mic.Settings.ShowConfirmation = shwConf.IsChecked.Value;

            SpeechRecognitionUIResult res = await mic.RecognizeWithUIAsync();

            if (res != null)

            {

                MessageBox.Show("Text Input: "+res.RecognitionResult.Text);

            }

        }

 

    }

}

 

 

 

 

 

 

 

 

Summary

That's all for this article. Now you can customize the Speech recognition UI to suite your app's needs. In case of any doubt feel free to ask in the comments.