Share via

使用語音來叫用 UI 元素

  • 發行項

語音啟用殼層 (VES) 是 Windows 語音平台的延伸模組，可在應用程式中啟用一流的語音體驗，讓使用者使用語音來叫用螢幕控制項，並透過聽寫插入文字。 VES 致力於在所有 Windows Shell 和裝置上提供通用的端到端「看到什麼就說什麼」體驗，而應用程式開發人員只需付出最少的努力。 為了達成此目的，它會利用 Microsoft 語音平台和使用者介面自動化 (UIA) 架構。

使用者體驗逐步解說

以下是在 Xbox 上使用 VES 時使用者體驗的概觀，在深入了解 VES 運作方式的詳細資料之前，應該先協助設定內容。

  • 使用者開啟 Xbox 主機，並想要瀏覽應用程式以尋找感興趣的項目：

    使用者：「嗨 Cortana，開啟我的遊戲和應用程式」

  • 使用者會留在 [主動聆聽模式] (ALM)，這表示主控台現在正在聆聽使用者叫用螢幕上可見的控制項，而不需要每次都說「嗨 Cortana」。 使用者現在可以切換檢視應用程式，並捲動應用程式清單：

    使用者：「應用程式」

  • 若要捲動檢視，使用者只需說：

    使用者：「向下捲動」

  • 使用者會看到他們感興趣的應用程式方塊圖案，但忘記名稱。 使用者要求顯示語音提示標籤：

    使用者：「顯示標籤」

  • 現在已清楚要說什麼，就可以啟動應用程式：

    使用者：「電影和電視」

  • 若要結束作用中的接聽模式，使用者會讓 Xbox 停止接聽：

    使用者：「停止接聽」

  • 稍後，新的使用中接聽工作階段以透過以下來啟動：

    使用者：「嗨 Cortana，請做選擇」或「嗨 Cortana，選擇」

UI 自動化相依性

VES 是 UI 自動化用戶端，依賴應用程式透過其 UI 自動化提供者所公開的資訊。 這是 Windows 平台上朗讀程式功能已使用的相同基礎結構。 UI 自動化可讓您以程式設計方式存取使用者介面元素，包括控制項的名稱、其類型和所實作的控制模式。 當應用程式 UI 變更時，VES 會回應 UIA 更新事件，並重新剖析更新的 UI 自動化樹狀結構，以尋找所有可採取動作的項目，使用此資訊來建置語音辨識文法。

所有 UWP 應用程式都可以存取 UI 自動化架構，而且可以公開與其建置所在之圖形架構無關的 UI相關資訊 (XAML、DirectX/Direct3D 等)。 在某些情況下 (例如 XAML)，大部分繁重的工作都是由架構完成，大幅減少支援朗讀程式和 VES 所需的工作。

如需 UI 自動化的詳細資訊，請參閱 UI 自動化基礎觀念。

控制叫用名稱

VES 採用下列啟發學習法來判斷要向語音辨識器註冊哪個片語做為控制項名稱 (即使用者需要說話才能叫用控制項)。 這也是語音提示標籤中顯示的片語。

依優先順序排序的名稱來源：

  1. 如果該元素具有 LabeledBy 附加屬性，VES 會使用此文字標籤的 AutomationProperties.Name。
  2. 元素的 AutomationProperties.Name。 在 XAML 中，控制項的文字內容將做為 AutomationProperties.Name 的預設值。
  3. 如果控制項是 ListItem 或 Button，VES 會尋找具有有效 AutomationProperties.Name的第一個子元素。

可採取動作的控制項

如果 VES 實作下列其中一個自動化控制項模式，則會將其視為可採取動作的控制項：

  • InvokePattern (例如 Button) - 表示啟動或執行單一、明確的動作，並且在啟動時不保持狀態的控制項。

  • TogglePattern (例如 Check Box) - 代表可循環執行一組狀態並維護一次設定狀態的控制項。

  • SelectionItemPattern (例如 Combo Box) - 表示一個控制項，該控制項充當可選子項集合的容器。

  • ExpandCollapsePattern (例如 Combo Box) - 表示直覺式展開以顯示內容，摺疊以隱藏內容的控制項。

  • ScrollPattern (例如 List) - 代表可當成子元素集合捲動式容器使用的控制項。

可捲動的容器

對於支援 ScrollPattern 的可捲動容器，VES 會聆聽語音命令，例如「向左捲動」、「向右捲動」等，並在使用者觸發其中一個命令時，使用適當的參數叫用 Scroll。 Scroll 命令會根據 HorizontalScrollPercent 和 VerticalScrollPercent 屬性的值插入。 例如，如果 HorizontalScrollPercent 大於 0，則會新增「向左捲動」，如果小於 100，則會新增「向右捲動」等。

朗讀程式重疊

朗讀程式應用程式也是 UI 自動化用戶端，並使用 AutomationProperties.Name 屬性做為目前所選 UI 元素讀取之文字的來源之一。 為了提供更好的輔助功能體驗，許多應用程式開發人員都利用冗長的描述性文字來多載 Name 屬性，目標是在朗讀程式讀取時提供更多資訊和內容。 不過，這會導致這兩個特徵之間的衝突：VES 需要符合或緊密比對控制項可見文字的簡短片語，而朗讀程式則受益於較長、更具描述性的詞組來提供更好的內容。

為解決此問題，從 Windows 10 Creators Update 開始，朗讀程式已更新為也可查看 AutomationProperties.HelpText 屬性。 如果這個屬性不是空的，朗讀程式除了 AutomationProperties.Name 之外，還會說出其內容。 如果 HelpText 是空的，朗讀程式只會讀取 Name 的內容。 這會在需要時啟用較長的描述性字串，但會在 Name 屬性中維持較短的語音辨識易記片語。

該圖顯示按鈕背後的程式碼，其中包括 AutomationProperties.Name 和 AutomationProperties.HelpText，顯示啟用語音的殼層聆聽名稱設定。

如需詳細資訊，請參閱 UI 中的輔助功能支援自動化屬性。

作用中接聽模式 (ALM)

輸入 ALM

在 Xbox 上，VES 不會持續接聽語音輸入。 使用者必須明確輸入主動接聽模式，方法是說：

  • 「嗨 Cortana，選擇」， 或
  • 「嗨 Cortana，請做選擇」

還有數個其他 Cortana 命令也會讓使用者在完成時保持主動聆聽，例如「嗨 Cortana，登入」或「嗨 Cortana，回家」。

輸入 ALM 會有下列效用：

  • Cortana 重疊會顯示在右上角，告訴使用者他們可以說出他們所看到的內容。 當使用者說話時，語音辨識的片段也會顯示在此位置。

  • VES 會剖析 UIA 樹狀結構、尋找所有可採取動作的控制項、在語音識別文法中登錄其文字，並開始連續接聽工作階段。

    醒目顯示了「若要查看標籤，請說出顯示標籤」選項的螢幕擷取畫面。

正在結束 ALM

當使用者使用語音與 UI 互動時，系統會保留在 ALM 中。 有兩種方式可結束 ALM：

  • 使用者明確表示「停止聆聽」，或
  • 如果進入 ALM 後 17 秒內或自上次正面識別後沒有正面識別，則會發生逾時

叫用控制項

在 ALM 中時，使用者可以使用語音與 UI 互動。 如果 UI 已正確設定 (名稱屬性符合可見文字)，則使用語音來執行動作應該會是順暢、自然的體驗。 使用者應該只能夠說他們在畫面上看到的內容。

Xbox 上的重疊 UI

VES 為控制項衍生的名稱，可能不同於 UI 中實際可見的文字。 這可能是因為控制項的 Name 屬性或明確設定為不同字串的附加 LabeledBy 元素所造成。 或者，控制項沒有 GUI 文字，只有圖示或影像元素。

在這些情況下，使用者需要一種查看需要說什麼才能叫用這類控制項的方式。 因此，一旦在主動聆聽，即會顯示語音提示，方法是說出「顯示標籤」。 這會導致語音提示標籤出現在每個可採取動作的控制項上方。

因為限制 100 個標籤，因此如果應用程式的 UI 有超過 100 個可操作的控制項，將會有一些不會顯示語音提示標籤。 在這種情況下選擇哪些標籤是不確定的，因為它取決於目前 UI 的結構和組合，如 UIA 樹狀結構中第一個列舉。

一旦顯示語音提示標籤時，沒有任何命令可以隱藏標籤，在發生下列其中一個事件之前仍會顯示標籤：

  • 使用者叫用控制項
  • 使用者離開目前的場景瀏覽
  • 使用者說「停止聆聽」
  • 作用中的接聽模式逾時

語音提示標籤的位置

語音提示標籤會在控制項的 BoundingRectangle 中水平和垂直置中。 當控制項很小且緊密分組時，標籤可能會重疊/被其他人遮蔽，VES 會嘗試將這些標籤推開以分隔開來，並確保它們可見。 不過，這不保證可在 100% 的時間內運作。 如果有非常擁擠的 UI，可能會導致某些標籤被其他人遮蔽。 請檢閱具有「顯示標籤」的 UI，以確保語音提示可見度有足夠的空間。

語音提示標籤在控制項邊框中水平和垂直置中的螢幕擷取畫面。

下拉式方塊

當下拉式方塊展開下拉式方塊中的每個個別項目時，會取得自己的語音提示標籤，而且這些標籤通常位於下拉式清單後面的現有控制項上。 為了避免標籤呈現雜亂且混亂 (其中下拉式方塊項目標籤與下拉式方塊後方控制項標籤混在一起)，當下拉式方塊展開時，只會顯示其子項目的標籤：所有其他語音提示標籤都會隱藏。 然後，使用者可以選取其中一個下拉式項目或「關閉」下拉式方塊。

  • 摺疊下拉式方塊上的標籤：

    顯示和聲音視訊輸出視窗的螢幕擷取畫面，其中折疊的下拉式方塊中包含標籤。

  • 展開下拉式方塊上的標籤：

    顯示和聲音視訊輸出視窗的螢幕擷取畫面，其中展開的下拉式方塊中包含標籤。

可捲動的控制項

針對可捲動的控制項，捲動命令的語音提示會置中於每個控制項邊緣。 語音提示只會針對可採取動作的捲動方向顯示，例如，如果無法使用垂直捲動，則不顯示「向上捲動」和「向下捲動」。 當有多個可捲動的區域存在時，VES 會使用序數區別 (例如：「向右捲動 1」、「向右捲動 2」等。

水平捲動 UI 上向左捲動和向右捲動語音提示的螢幕擷取畫面。

消除歧義

當多個 UI 元素具有相同名稱，或語音辨識器符合多個候選項目時，VES 會進入消除歧義模式。 在此模式中，會針對相關的元素顯示語音提示標籤，讓使用者可以選取正確的標籤。 使用者可說出「取消」來取消消除歧義模式。

例如：

  • 在作用中接聽模式中，在消除歧義之前使用者說：「我模棱兩可」：

    主動聆聽模式的螢幕擷取畫面，其中顯示「現在您可以說出您所看到的內容」選項，且按鈕上沒有標籤。

  • 兩個按鈕都相符；已啟動消除歧義：

    主動聆聽模式的螢幕擷取畫面，其中顯示「您想要哪一個」選項，按鈕上有「項目 1」和「項目 2」標籤。

  • 選擇 [選取 2] 時顯示按一下動作：

    主動聆聽模式的螢幕擷取畫面，其中顯示「現在您可以說出您所看到的內容」選項，且第一個按鈕上有「是否表達模糊」標籤。

範例 UI

以下是 XAML 型 UI 範例，以各種方式設定 AutomationProperties.Name：

<Page
    x:Class="VESSampleCSharp.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:VESSampleCSharp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Button x:Name="button1" Content="Hello World" HorizontalAlignment="Left" Margin="44,56,0,0" VerticalAlignment="Top"/>
        <Button x:Name="button2" AutomationProperties.Name="Launch Game" Content="Launch" HorizontalAlignment="Left" Margin="44,106,0,0" VerticalAlignment="Top" Width="99"/>
        <TextBlock AutomationProperties.Name="Day of Week" x:Name="label1" HorizontalAlignment="Left" Height="22" Margin="168,62,0,0" TextWrapping="Wrap" Text="Select Day of Week:" VerticalAlignment="Top" Width="137"/>
        <ComboBox AutomationProperties.LabeledBy="{Binding ElementName=label1}" x:Name="comboBox" HorizontalAlignment="Left" Margin="310,57,0,0" VerticalAlignment="Top" Width="120">
            <ComboBoxItem Content="Monday" IsSelected="True"/>
            <ComboBoxItem Content="Tuesday"/>
            <ComboBoxItem Content="Wednesday"/>
            <ComboBoxItem Content="Thursday"/>
            <ComboBoxItem Content="Friday"/>
            <ComboBoxItem Content="Saturday"/>
            <ComboBoxItem Content="Sunday"/>
        </ComboBox>
        <Button x:Name="button3" HorizontalAlignment="Left" Margin="44,156,0,0" VerticalAlignment="Top" Width="213">
            <Grid>
                <TextBlock AutomationProperties.Name="Accept">Accept Offer</TextBlock>
                <TextBlock Margin="0,25,0,0" Foreground="#FF5A5A5A">Exclusive offer just for you</TextBlock>
            </Grid>
        </Button>
    </Grid>
</Page>

使用上述的這些範例，看起來像是有語音提示標籤和沒有語音提示標籤的 UI。

  • 在 [作用中接聽模式] 中，沒有顯示標籤：

    主動聆聽模式的螢幕擷取畫面，顯示「若要查看標籤，請說出顯示標籤」選項，且未顯示任何標籤。

  • 在 [作用中接聽模式] 中，在使用者說 「顯示標籤」之後：

    主動聆聽模式的螢幕擷取畫面，其中顯示「如果您完成了，請說停止聆聽」選項，且 UI 控制項上顯示標籤。

在 button1 的案例中，XAML 會自動使用控制項可見文字內容中的文字填入 AutomationProperties.Name 屬性。 這就是為什麼即使沒有明確的 AutomationProperties.Name 設定，還是有語音提示標籤的原因。

使用 button2時，我們會明確地將 AutomationProperties.Name 設定為控件文字以外的項目。

使用 comboBox 時，我們會使用 LabeledBy 屬性來參考 label1 做為自動化 Name 的來源 ，並在 label1 中將 AutomationProperties.Name 設定為比在螢幕上所轉譯的還要更自然的片語 (「星期幾」，而不是「選取星期幾」)。

最後，使用 button3 時，VES 會從第一個子元素擷取 Name，因為 button3 本身沒有 AutomationProperties.Name 集合。

另請參閱