Ljudbeskrivningar med Skärmläsaren

Slutförd

Talsyntes har utvecklats mycket sedan de tidigare robotrösterna med stelt uttal. Skärmläsaren tillhandahåller en inbyggd skärmläsare i Windows, vilket kan vara till stor hjälp för användare med nedsatt syn. Dock behöver vi konfigurera appen att använda den också.

I den här utbildningsenheten lär du dig följande:

  • Hur då aktiverar Skärmläsaren och testar den på en app utan särskilda attribut för uppläsning.
  • Hur du lägger till specialattribut i en app i syfte att förbättra uppläsningens kvalitet.
  • Hur du rensar slarv i våra strängar och meddelanden så att de låter bra.
  • Att luckor i uppläsningen kan fyllas med en anpassad instans av en talsyntes.

Skärmläsaren

Se till att appen för vetenskaplig kalkylator är igång. Vi behöver ändra XAML och code-behind så att användarupplevelsen blir så bra som möjligt med Skärmläsaren.

Aktivera och testa Skärmläsaren

  1. Skriv "inställningar för skärmläsaren" i Windows-sökfältet och välj sedan Ease of Access Narrator settings (Hjälpmedelsinställningar för Skärmläsaren). Då öppnas följande skärm.

Turning on the narrator.

  1. Aktivera växeln Använd Skärmläsaren och minimera sedan fönstret. Uppläsning kan vara problematisk när du växlar mellan appar och utvecklar programvara, och därför bör du ha det här fönstret öppet. På så sätt kan du inaktivera det när du gör ändringar i koden och sedan aktivera igen för testning.

  2. Markera knappen Visa konstanter i kalkylatorn och lägg märke till hur Skärmläsaren hanterar beskrivningen: Visa konstanter (pausa). Vi vill hjälpa Skärmläsaren att göra dess beskrivningar så användbara som möjligt. Det innebär att vi arbetar med dess inbyggda funktioner. En av dessa funktioner är att presentera typen av användargränssnittselement (vilket är "knapp" i det här fallet).

  3. Välj nu knappen Sqrt (kvadratrot) och observera uttalet. "Sqrt" är en vanlig förkortning av kvadratrot inom matematiken, men det vet inte Skärmläsaren. Den känner heller inte igen Sin, Asin, Acos och så vidare, särskilt när sådana specialiserade termer även kan uttalas som vanliga ord på engelska. Vi behöver hjälpa Skärmläsaren att tolka sådana uttal korrekt.

  4. Välj olika andra knappar (åtgärder och tal) och observera hur uppläsningen hanteras. Det finns situationer då den presterar väl och andra där den behöver förbättras.

  5. Gå tillbaka till knappen Visa konstanter och välj den. Välj de olika konstanterna och observera uppläsningen. Välj flera av konstanterna och utvärdera hur användbart uttalet är. På de ställen där vi har varit lite lata och lagt in förkortningar (till exempel "Gms", "Ozs" och "Cms") är uttalet inte användbart. Förkortningar är inte användbara om användarna inte förstår dem.

  6. Ange slutligen följande beräkning: SqrtAtan0.5. Välj textdisplayen för beräkningen utan att välja = och observera hur Skärmläsaren hanterar det. Tryck nu på = och välj textdisplayen igen. Som tur är kan Skärmläsaren hantera långa tal väl.

  7. Öppna fönstret med inställningar för Skärmläsaren och stäng av uppläsning för tillfället.

Det framgår från vårt test av Skärmläsaren med kalkylatorn att det finns några problem att jobba med: uttalet av matematiska funktioner och åtgärder samt tydligheten för listan över konstanter.

Göra textsträngarna naturliga

I det här avsnittet hjälper vi Skärmläsaren att låta naturlig när funktioner i kalkylatorn används. Se till att Visual Studio är öppet med projektet för vetenskaplig kalkylator.

  1. När ett användargränssnittselement markeras och läses upp testar Skärmläsaren först för egenskapen AutomationProperties.Name. Om något av dessa hittas blir detta det ord eller den fras som används. Om inget hittas används i stället egenskapen Content (innehåll). För alla användargränssnittselement som inte uttalas väl behöver vi därför lägga till egenskapen AutomationProperties.Name med ett namn som kan uttalas tydligt. I filen MainPage.xaml lägger du till följande namnegenskaper till respektive xaml-poster. Det här är en lång lista, så ta den tid du behöver för att lägga till posterna en i taget. Klipp ut och klistra in från listan nedan eller använd funktionerna för snabb attributinmatning i Visual Studio.
 <Button x:Name="ButtonNMemoryPlus" AutomationProperties.Name="Memory plus" Content="M+"
 <Button x:Name="ButtonNMemoryMinus" AutomationProperties.Name="Memory minus" Content="M-"
 <Button x:Name="ButtonNMemoryMultiply" AutomationProperties.Name="Memory times" Content="M*"
 <Button x:Name="ButtonNMemoryDivide" AutomationProperties.Name="Memory divided by" Content="M/"
 <Button x:Name="ButtonLeft" AutomationProperties.Name="Open" Content="("
 <Button x:Name="ButtonSqrt" AutomationProperties.Name="Square root" Content="Sqrt"
 <Button x:Name="ButtonPow" AutomationProperties.Name="to the Power of" Content="^"
 <Button x:Name="ButtonPi" AutomationProperties.Name="Pi" Content="&#928;"
 <Button x:Name="ButtonRight" AutomationProperties.Name="Close" Content=")"
 <Button x:Name="ButtonArcsine" AutomationProperties.Name="Arc sine" Content="Asin"
 <Button x:Name="ButtonArccosine" AutomationProperties.Name="Arc cosine" Content="Acos"
 <Button x:Name="ButtonArctangent" AutomationProperties.Name="Arc tangent" Content="Atan"
 <Button x:Name="ButtonSin" AutomationProperties.Name="Sine" Content="Sin"
 <Button x:Name="ButtonCos" AutomationProperties.Name="Cosine" Content="Cos"
 <Button x:Name="ButtonTan" AutomationProperties.Name="Tangent" Content="Tan"
 <Button x:Name="ButtonNegative" AutomationProperties.Name="Negative" Content="-N"
 <Button x:Name="ButtonPlus" AutomationProperties.Name="plus" Content="+"
 <Button x:Name="ButtonMinus" AutomationProperties.Name="minus" Content="-"
 <Button x:Name="ButtonMultiply" AutomationProperties.Name="times" Content="*"
 <Button x:Name="ButtonDivide" AutomationProperties.Name="divided by" Content="/"
 <Button x:Name="ButtonEquals" AutomationProperties.Name="equals" Content="="
 <TextBox x:Name="TextDisplay" AutomationProperties.Name="Calculation"
 <Button x:Name="ButtonClr" AutomationProperties.Name="Clear" Content="Clr"
 <Button x:Name="ButtonDel" AutomationProperties.Name="Delete" Content="Del"
   />
  1. Nästa steg är att åtgärda bristerna i listan över konstanter. Öppna filen MainPage.xaml.cs och leta upp metoden LoadConstants.

  2. Ersätt listan över strängar med följande. Lägg märke till att alla förkortade termer har ersatts med fullständiga varianter.

string[] initialConstants = {
                "Acceleration due to gravity = 9.80665",
                "Bars to pounds per square inch = 14.5037738",
                "Centimeters to inches = 0.393700787",
                "Degrees to radians = 0.0174532925",
                "Feet to meters = 0.3048",
                "Grams to ounces = 0.035273",
                "Inches to centimeters = 2.540",
                "Inches to millimeters = 25.4",
                "Kilograms to pounds = 2.20462262",
                "Kilometers to miles = 0.621371192",               
                "Liters to pints = 2.11337642",
                "Meters to feet= 3.2808",
                "Miles to kilometers = 1.609344",
                "Millimeters to inches = 0.0393700787",
                "Ounces to grams = 28.3495",
                "Pints to liters = 0.473176473",   
                "Pounds per square inch to bars = 0.0689475729",
                "Pounds to kilograms = 0.45359237",                            
                "Radians to degrees = 57.2957795",
                "Speed of light in meters per second = 299792458",
                "Speed of light in miles per second = 186282.397"
            };
  1. Kör nu appen och aktivera uppläsning. För att vara noggrann behöver markera varje matematikfunktion, åtgärd och konstant så att Skärmläsaren läser upp dem. Låter allihop nu naturliga och lättförståeliga? Om de inte gör det korrigerar du strängarna eller lägger till eller justerar egenskapen AutomationProperties.Name.

  2. Prova att ange en beräkning med parenteser och flera matematikfunktioner (det spelar ingen roll om de är matematiskt ologiska) och markera sedan textdisplayen. Vi behöver lägga till lite kod för att åtgärda det här.

Lägga till kod som hjälper Skärmläsaren

Tack vare våra ändringar presterar Skärmläsaren nu utmärkt vad gäller användargränssnittselementen. Det finns dock några fall då ett uppläst meddelande vore användbart men den utlösande händelsen inte är ett användargränssnittselement. Dessutom vill vi förbättra uttalet av beräkningen. Här kommer vi lägga till en talsyntes för att hantera felmeddelanden samt några korta kodändringar som hanterar beräkningen.

  1. Öppna filen MainPage.xaml.cs och uppdatera using-instruktionerna till att inkludera följande.
using System.Threading.Tasks;
using Windows.Media.SpeechSynthesis;
using Windows.UI.Xaml.Automation;
  1. Lägg till följande i listan över de globala variablerna.
        // Declare variables needed for speech output.
        SpeechSynthesizer speech;
        MediaElement mediaElement;
  1. Initiera de här variablerna i metoden MainPage så att den nu ser ut så här.
        public MainPage()
        {
            this.InitializeComponent();

            // Hide the error field.
            textError.Visibility = Visibility.Collapsed;

            LoadConstants();

            calculation = new ArrayList();
            backupCalculation = new ArrayList();

            mode = Emode.Calculate;

            // The objects for controlling and playing audio.
            speech = new SpeechSynthesizer();
            mediaElement = new MediaElement();
        }
  1. Det är bra att lägga till en växel eller ett annat användargränssnittselement så att användaren kan välja om uppläsningshjälp ska användas. I filen MainPage.xaml går du precis ovanför posten listConstants (nära de sista posterna för användargränssnittselement) och lägger till följande.
        <ToggleSwitch x:Name="ToggleNarration"
            Margin="551,407,0,0"
            HorizontalAlignment="Left"
            VerticalAlignment="Top"
            Header="Narration help"
            IsOn="True" />

Kommentar

Det är viktigt att de här elementen hamnar i rätt ordning i XAML-filen. Annars visas avslöjande effekter, till exempel att den här posten dyker upp i listan över konstanter.

  1. Gå till MainPage.xaml.cs igen och lägg till en SayAsync-metod för uppläsning av valfri textrad. Observera användningen av variablerna speech och mediaElement som vi just lade till samt att det här är en asynkron uppgift.
        private async Task SayAsync(string text)
        {
            // Narrate the given text if narration help is on.
            if (ToggleNarration.IsOn == true)
            {
                // Generate the audio stream from plain text.
                SpeechSynthesisStream stream = await speech.SynthesizeTextToStreamAsync(text);

                // Send the stream to the media object, then play it.
                mediaElement.SetSource(stream, stream.ContentType);
                mediaElement.Play();
            }
        }
  1. Nu behöver vi lägga till anrop till metoden SayAsync. Börja med blocket catch i metoden CalculateAsync.
            catch
            {
                TextError.Visibility = Visibility.Visible;
                CopyCalculation(backupCalculation, calculation);
                await SayAsync("Oops, there is an error in your calculation.");
            }
  1. Medan du fortfarande är i metoden CalculateAsync lägger du till följande anrop till SayAsync efter de rader som visas här.
                    // Add the entry to the next calculation, just in case the user wants to add to it.
                    OneEntry resultEntry = new OneEntry(Etoken.Number, result, txt);
                    calculation.Add((object)resultEntry);

                    await SayAsync($"The result is: {txt}");
  1. Leta nu upp metoden Button_Click och ändra posten default: i växelblocket till följande. Detta gör att beräkningen kan uttalas.
                default:

                    // User has clicked a math or digit button.
                    string tag = b.Tag.ToString();
                    string txt = "";

                    // If in narrative mode, then use a full English string for the display text, if a full string has been specified.
                    if (ToggleNarration.IsOn == true)
                    {
                        txt = b.GetValue(AutomationProperties.NameProperty).ToString();
                    }

                    // Use the content of the button as the equation text.
                    if (txt.Length == 0)
                    {
                        txt = b.Content.ToString();
                    }

                    MathEntry(txt, tag);
                    break;
  1. Testa koden genom att köra appen. Se till att Skärmläsaren och växlingsknappen Narration help (hjälp med Skärmläsaren) är aktiverade. Ange en ologisk beräkning (till exempel Sqrt (, vilket visas som Square root Open (roten av öppna)). Får du ett meddelande som låter naturligt när du väljer =? Observera att samma röst används för din SayAsync-metod och Skärmläsaren, vilket gör ljudupplevelsen harmonisk.

  2. Slutför beräkningen och observera att texten skrivs ut på displayen. Om du sedan markerar displayen läses beräkningen upp tydligt av Skärmläsaren. Vissa åtgärder kan fortfarande vara utmanande, men det här är tillräckligt bra för att ge en mycket mer tillgänglig upplevelse.

Genom att lägga till ett alternativ för talsyntes i din app kan du fylla eventuella luckor i uppläsningen, vilket hjälper dina användare. Detta beror starkt på den aktuella appen, så du bör prioritera användargränssnittselement som fungerar bra med Skärmläsaren först. En minimal mängd ytterligare uppläsning kan vara allt du behöver, vilket är fallet här.

Sammanfattning av lektionen

I den här lektionen lärde vi oss att talsyntes nu är otrolig bra, åtminstone jämfört med hur det fungerade förr. Vi lärde oss att det ingår en hel del uppläsning utan extra kostnad i Windows, vilket du kommer åt genom att aktivera Skärmläsaren. Dock lärde vi oss även att brister i meddelandesträngen framträder tydligt när Skärmläsaren används. För att skapa en tillgänglig app behöver vi se till att meddelandesträngarna är tydliga och fullständiga.

Vi lärde oss även att Skärmläsaren inte är perfekt och att den behöver hjälp i vissa situationer. Till exempel uttalas ett matematiskt ord som "sin" inte korrekt eftersom kortformen av ordet är ett naturligt ord i sig. Som tur är finns det XAML-inställningar för att åtgärda det här problemet, och de är inte svåra att implementera.