更改AutoSuggestBox的触摸键盘布局(InputScope)

Question

在UWP中，有一个可用于TextBox和RichEditBox的InputScope方法，可用于为不同类型的输入定义键盘布局。但问题是没有针对AutoSuggestBox的InputScope。我使用AutoSuggestBox来输入URI，因此我需要“.com”按钮才能出现在触摸键盘上。

我知道AutoSuggestBox是从TextBox类派生的(可能)，所以它应该与inputScope方法一起工作。我用了这个黑客-

 private void AutoSuggestBox_GotFocus(object sender, RoutedEventArgs e)
    {
        InputScope keyType = new InputScope();
        InputScopeName typeOfKeyboard = new InputScopeName();
        typeOfKeyboard.NameValue = InputScopeNameValue.Url;
        keyType.Names.Add(typeOfKeyboard);
        (e.OriginalSource as TextBox).InputScope = keyType;  
    }

但它仍然不起作用。这个问题有没有其他解决方案，因为我不想用任何其他输入类型替换ASB。

Answer 1

在AutoSuggestBox第一次获得焦点后，您的代码片段应该可以工作。在AutoSuggestBox第一次被聚焦之前，InputScope是默认值，所以当它第一次被聚焦时，新的输入作用域不会生效，第二次被聚焦时它会生效。

AutoSuggestBox实际上由一个TextBox和一个Popup组成。更改AutoSuggestBox的输入范围实际上就是更改AutoSuggestBox内部TextBox的输入范围。因此，更新AutoSuggestBox的模板如下：

<AutoSuggestBox x:Name="autosuggestbox">
    <AutoSuggestBox.Style>
        <Style TargetType="AutoSuggestBox">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="AutoSuggestBox">
                        <Grid x:Name="LayoutRoot">
                            <TextBox
                                x:Name="TextBox"
                                Width="{TemplateBinding Width}"
                                Margin="0"
                                Canvas.ZIndex="0"
                                DesiredCandidateWindowAlignment="BottomEdge"
                                Header="{TemplateBinding Header}"
                                InputScope="Url"
                                PlaceholderText="{TemplateBinding PlaceholderText}"
                                ScrollViewer.BringIntoViewOnFocusChange="False"
                                Style="{TemplateBinding TextBoxStyle}" />
                            <Popup x:Name="SuggestionsPopup">
                                <Border x:Name="SuggestionsContainer">
                                    <Border.RenderTransform>
                                        <TranslateTransform x:Name="UpwardTransform" />
                                    </Border.RenderTransform>
                                    <ListView
                                        x:Name="SuggestionsList"
                                        MaxHeight="{ThemeResource AutoSuggestListMaxHeight}"
                                        Margin="{ThemeResource AutoSuggestListMargin}"
                                        Padding="{ThemeResource AutoSuggestListPadding}"
                                        Background="{ThemeResource AutoSuggestBoxSuggestionsListBackground}"
                                        BorderBrush="{ThemeResource AutoSuggestBoxSuggestionsListBorderBrush}"
                                        BorderThickness="{ThemeResource AutoSuggestListBorderThemeThickness}"
                                        DisplayMemberPath="{TemplateBinding DisplayMemberPath}"
                                        IsItemClickEnabled="True"
                                        ItemContainerStyle="{TemplateBinding ItemContainerStyle}"
                                        ItemTemplate="{TemplateBinding ItemTemplate}"
                                        ItemTemplateSelector="{TemplateBinding ItemTemplateSelector}">
                                        <ListView.ItemContainerTransitions>
                                            <TransitionCollection />
                                        </ListView.ItemContainerTransitions>
                                    </ListView>
                                </Border>
                            </Popup>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="Orientation">
                                    <VisualState x:Name="Landscape" />
                                    <VisualState x:Name="Portrait" />
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </AutoSuggestBox.Style>
</AutoSuggestBox>

更多详情请参考AutoSuggestBox styles and templates。

Answer 2

您可以编辑AutoSuggestBox的模板，并将InputScope设置为XAML中的TextBox。您可以找到AutoSuggestBox的默认模板Here。