c# - UWP 阻止 AutosuggestBox 自动聚焦

标签 c# xaml uwp

我在 ContentDialog 中有一个 AutosuggestBox,如下所示:

<ContentDialog x:Name="BrowseBySourceDialog"                                   
            Grid.Column="1"
            PrimaryButtonText="{x:Bind ViewModel._BTN_ok}"
            PrimaryButtonClick="BrowseBySourceDialog_PrimaryButtonClick"
            SecondaryButtonClick="Dialog_SecondaryButtonClick"
            SecondaryButtonText="{x:Bind ViewModel._BTN_close}"
            Opened="BrowseBySourceDialog_Opened"
            GotFocus="BrowseBySourceDialog_GotFocus"
            Style="{StaticResource ContentDialogStyles}">

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>


    <Border Background="#1A503E"
                MinHeight="40"
                Grid.Row="0">

        <TextBlock Text="{x:Bind ViewModel._HEADER_BROWSE_sourceOrganization}"                     
                    Style="{StaticResource DialogTextBlockStyle}" />
    </Border>

    <ListView Name="BrowseBySourceTopResultsListView" IsTabStop="True"
                x:FieldModifier="public"
                Grid.Row="3"
                SelectionMode="Single"
                IsItemClickEnabled="True"
                ItemClick="FeaturedResultsSourceListView_ItemClick"
                MaxHeight="500"                                                                             
                ItemsSource="{x:Bind BrowseBySourceList}">
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            </Style>
        </ListView.ItemContainerStyle>

        <ListView.ItemTemplate>
            <DataTemplate x:DataType="viewModels:BrowseByStarViewModel">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Image Source="{x:Bind icon}"
                            Width="40"
                            Height="40"
                            Margin="10"/>
                    <TextBlock Text="{x:Bind read}"
                                Grid.Column="1"
                                TextAlignment="Center"
                                VerticalAlignment="Center"
                                Margin="20, 0, 0, 0"/>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

    <AutoSuggestBox Grid.Row="1" 
                    Name="asbBrowseBySource"
                    TextMemberPath="read"    
                    PlaceholderText="{x:Bind ViewModel._TIPS_source_select}"      
                    LostFocus="asbBrowseBySource_LostFocus"                       
                    GotFocus="asbBrowseBySource_GotFocus"
                    TextChanged="asbBrowseBySource_TextChanged">
        <AutoSuggestBox.ItemTemplate>
            <DataTemplate x:DataType="response:ExploreApiResponseItem">
                <TextBlock Text="{x:Bind read}"
                           Margin="5"/>
            </DataTemplate>
        </AutoSuggestBox.ItemTemplate>
    </AutoSuggestBox>

    <ComboBox x:Name="BrowseBySourceComboBox"  
                LostFocus="BrowseBySourceComboBox_LostFocus"
                SelectionChanged="BrowseBySourceComboBox_SelectionChanged"
                Grid.Row="2"                                          
                PlaceholderText="{x:Bind ViewModel._TIPS_source_select}"      
                IsTextSearchEnabled="True"                                      
                Style="{StaticResource ComboBoxStyle}"
                ItemsSource="{x:Bind BrowseBySourceComboBoxList, Mode=OneWay}">

        <ComboBox.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel />
            </ItemsPanelTemplate>
        </ComboBox.ItemsPanel>
        <ComboBox.ItemTemplate>
            <DataTemplate x:DataType="response:ExploreApiResponseItem">
                <TextBlock Text="{x:Bind read}"
                            Margin="5"/>
            </DataTemplate>
        </ComboBox.ItemTemplate>

    </ComboBox>
</Grid>

问题是,一旦我打开 ContentDialog,我的 AutosuggestBox 就会自动获得焦点。由于我在 AutosuggestBox 的 GotFocus 事件中设置了 IsSuggestionListOpen = True,因此在打开内容对话框后会立即打开建议列表。我想停止此操作并仅在用户单击/点击 AutosuggestBOx

后打开建议列表

为了补充这个问题,当 AutosuggestBox 已经获得焦点并且我单击外部某处时,它不会失去焦点。

最佳答案

尝试切换 AutoSuggestBox 之间的顺序和你的ListView ,然后设置ListViewIsTapStopTrue .

<ListView Grid.Row="3" IsTabStop="True" ... />
<AutoSuggestBox Grid.Row="1" ... />

更新

有一个Grid里面ContentDialog的默认样式具有默认 Padding (即 ContentDialogPadding )并且它以某种方式阻止 LostFocus避免发生。

您可以通过删除此 Padding 来解决此问题并手动间隔其中的元素。

<Style TargetType="ContentDialog">
    <Setter Property="Foreground"
            Value="{ThemeResource ContentDialogForeground}" />
    <Setter Property="Background"
            Value="{ThemeResource ContentDialogBackground}" />
    <Setter Property="BorderBrush"
            Value="{ThemeResource ContentDialogBorderBrush}" />
    <Setter Property="HorizontalAlignment"
            Value="Center" />
    <Setter Property="VerticalAlignment"
            Value="Top" />
    <Setter Property="IsTabStop"
            Value="False" />
    <Setter Property="MaxHeight"
            Value="{ThemeResource ContentDialogMaxHeight}" />
    <Setter Property="MaxWidth"
            Value="{ThemeResource ContentDialogMaxWidth}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ContentDialog">
                <Border x:Name="Container">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="ButtonsVisibilityStates">
                            <VisualState x:Name="AllVisible" />
                            <VisualState x:Name="NoneVisible">
                                <VisualState.Setters>
                                    <Setter Target="PrimaryButton.Visibility"
                                            Value="Collapsed" />
                                    <Setter Target="SecondaryButton.Visibility"
                                            Value="Collapsed" />
                                    <Setter Target="CloseButton.Visibility"
                                            Value="Collapsed" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="PrimaryVisible">
                                <VisualState.Setters>
                                    <Setter Target="PrimaryButton.(Grid.Column)"
                                            Value="2" />
                                    <Setter Target="PrimaryButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="PrimaryButton.Margin"
                                            Value="2,0,0,0" />
                                    <Setter Target="SecondaryButton.Visibility"
                                            Value="Collapsed" />
                                    <Setter Target="CloseButton.Visibility"
                                            Value="Collapsed" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="SecondaryVisible">
                                <VisualState.Setters>
                                    <Setter Target="SecondaryButton.(Grid.Column)"
                                            Value="2" />
                                    <Setter Target="SecondaryButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="SecondaryButton.Margin"
                                            Value="2,0,0,0" />
                                    <Setter Target="PrimaryButton.Visibility"
                                            Value="Collapsed" />
                                    <Setter Target="CloseButton.Visibility"
                                            Value="Collapsed" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="CloseVisible">
                                <VisualState.Setters>
                                    <Setter Target="CloseButton.(Grid.Column)"
                                            Value="2" />
                                    <Setter Target="CloseButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="CloseButton.Margin"
                                            Value="2,0,0,0" />
                                    <Setter Target="PrimaryButton.Visibility"
                                            Value="Collapsed" />
                                    <Setter Target="SecondaryButton.Visibility"
                                            Value="Collapsed" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="PrimaryAndSecondaryVisible">
                                <VisualState.Setters>
                                    <Setter Target="PrimaryButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="SecondaryButton.(Grid.Column)"
                                            Value="2" />
                                    <Setter Target="SecondaryButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="SecondaryButton.Margin"
                                            Value="2,0,0,0" />
                                    <Setter Target="CloseButton.Visibility"
                                            Value="Collapsed" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="PrimaryAndCloseVisible">
                                <VisualState.Setters>
                                    <Setter Target="PrimaryButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="CloseButton.(Grid.Column)"
                                            Value="2" />
                                    <Setter Target="CloseButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="CloseButton.Margin"
                                            Value="2,0,0,0" />
                                    <Setter Target="SecondaryButton.Visibility"
                                            Value="Collapsed" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="SecondaryAndCloseVisible">
                                <VisualState.Setters>
                                    <Setter Target="SecondaryButton.(Grid.Column)"
                                            Value="0" />
                                    <Setter Target="SecondaryButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="SecondaryButton.Margin"
                                            Value="0,0,2,0" />
                                    <Setter Target="CloseButton.(Grid.Column)"
                                            Value="2" />
                                    <Setter Target="CloseButton.(Grid.ColumnSpan)"
                                            Value="2" />
                                    <Setter Target="CloseButton.Margin"
                                            Value="2,0,0,0" />
                                    <Setter Target="PrimaryButton.Visibility"
                                            Value="Collapsed" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="DefaultButtonStates">
                            <VisualState x:Name="NoDefaultButton" />
                            <VisualState x:Name="PrimaryAsDefaultButton">
                                <VisualState.Setters>
                                    <Setter Target="PrimaryButton.Style"
                                            Value="{StaticResource AccentButtonStyle}" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="SecondaryAsDefaultButton">
                                <VisualState.Setters>
                                    <Setter Target="SecondaryButton.Style"
                                            Value="{StaticResource AccentButtonStyle}" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState x:Name="CloseAsDefaultButton">
                                <VisualState.Setters>
                                    <Setter Target="CloseButton.Style"
                                            Value="{StaticResource AccentButtonStyle}" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Grid x:Name="LayoutRoot">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>
                        <Border x:Name="BackgroundElement"
                                Background="{TemplateBinding Background}"
                                FlowDirection="{TemplateBinding FlowDirection}"
                                BorderThickness="{ThemeResource ContentDialogBorderWidth}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                MaxWidth="{TemplateBinding MaxWidth}"
                                MaxHeight="{TemplateBinding MaxHeight}"
                                MinWidth="{ThemeResource ContentDialogMinWidth}"
                                MinHeight="{ThemeResource ContentDialogMinHeight}">
                            <Grid x:Name="DialogSpace"
                                  VerticalAlignment="Stretch">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*" />
                                    <RowDefinition Height="Auto" />
                                </Grid.RowDefinitions>
                                <ScrollViewer x:Name="ContentScrollViewer"
                                              HorizontalScrollBarVisibility="Disabled"
                                              VerticalScrollBarVisibility="Disabled"
                                              ZoomMode="Disabled"
                                              Margin="{ThemeResource ContentDialogContentScrollViewerMargin}"
                                              IsTabStop="False">
                                    <Grid>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="*" />
                                        </Grid.RowDefinitions>
                                        <ContentControl x:Name="Title"
                                                        Margin="{ThemeResource ContentDialogTitleMargin}"
                                                        Content="{TemplateBinding Title}"
                                                        ContentTemplate="{TemplateBinding TitleTemplate}"
                                                        FontSize="20"
                                                        FontFamily="XamlAutoFontFamily"
                                                        FontWeight="Normal"
                                                        Foreground="{TemplateBinding Foreground}"
                                                        HorizontalAlignment="Left"
                                                        VerticalAlignment="Top"
                                                        IsTabStop="False">
                                            <ContentControl.Template>
                                                <ControlTemplate TargetType="ContentControl">
                                                    <ContentPresenter Content="{TemplateBinding Content}"
                                                                      MaxLines="2"
                                                                      TextWrapping="Wrap"
                                                                      ContentTemplate="{TemplateBinding ContentTemplate}"
                                                                      Margin="{TemplateBinding Padding}"
                                                                      ContentTransitions="{TemplateBinding ContentTransitions}"
                                                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                                                </ControlTemplate>
                                            </ContentControl.Template>
                                        </ContentControl>
                                        <ContentPresenter x:Name="Content"
                                                          ContentTemplate="{TemplateBinding ContentTemplate}"
                                                          Content="{TemplateBinding Content}"
                                                          FontSize="{ThemeResource ControlContentThemeFontSize}"
                                                          FontFamily="{ThemeResource ContentControlThemeFontFamily}"
                                                          Margin="{ThemeResource ContentDialogContentMargin}"
                                                          Foreground="{TemplateBinding Foreground}"
                                                          Grid.Row="1"
                                                          TextWrapping="Wrap" />
                                    </Grid>
                                </ScrollViewer>
                                <Grid x:Name="CommandSpace"
                                      Margin="24,0,24,24"
                                      Grid.Row="1"
                                      HorizontalAlignment="Stretch"
                                      VerticalAlignment="Bottom"
                                      XYFocusKeyboardNavigation="Enabled">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition />
                                        <ColumnDefinition Width="0.5*" />
                                        <ColumnDefinition Width="0.5*" />
                                        <ColumnDefinition />
                                    </Grid.ColumnDefinitions>
                                    <Button x:Name="PrimaryButton"
                                            Content="{TemplateBinding PrimaryButtonText}"
                                            IsEnabled="{TemplateBinding IsPrimaryButtonEnabled}"
                                            Style="{TemplateBinding PrimaryButtonStyle}"
                                            ElementSoundMode="FocusOnly"
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Stretch"
                                            Margin="0,0,2,0"
                                            Grid.Column="0" />
                                    <Button x:Name="SecondaryButton"
                                            Content="{TemplateBinding SecondaryButtonText}"
                                            IsEnabled="{TemplateBinding IsSecondaryButtonEnabled}"
                                            Style="{TemplateBinding SecondaryButtonStyle}"
                                            ElementSoundMode="FocusOnly"
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Stretch"
                                            Margin="2,0,2,0"
                                            Grid.Column="1"
                                            Grid.ColumnSpan="2" />
                                    <Button x:Name="CloseButton"
                                            Content="{TemplateBinding CloseButtonText}"
                                            Style="{TemplateBinding CloseButtonStyle}"
                                            ElementSoundMode="FocusOnly"
                                            HorizontalAlignment="Stretch"
                                            VerticalAlignment="Stretch"
                                            Margin="2,0,0,0"
                                            Grid.Column="3" />
                                </Grid>
                            </Grid>
                        </Border>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

上面的代码大部分来自默认样式,除了我做了两处更改 -

  1. 我删除了 PaddingDialogSpace
  2. 我给了CommandSpace一个Margin24,0,24,24 .

最后,我添加了默认的 Padding24,18,24,0达到您的顶级级别 Grid里面ContentDialog .


更新2

如果您想关闭 AutoSuggestBoxPopup ,您将必须手动执行此操作。其内部GotFocus处理程序,使用 VisualTreeHelper找到背景矩形,并连接它的 Tapped事件,因此每当点击它时,您只需手动设置 IsSuggestionListOpenfalse 。您还必须将焦点设置到另一个控件上。

var box = (AutoSuggestBox)sender;
box.IsSuggestionListOpen = true;

var popups = VisualTreeHelper.GetOpenPopups(Window.Current);
foreach (var popup in popups)
{
    if (popup.Child is Rectangle bg)
    {
        bg.Tapped += Bg_Tapped;

        void Bg_Tapped(object s, TappedRoutedEventArgs args)
        {
            bg.Tapped -= Bg_Tapped;

            box.IsSuggestionListOpen = false;
            BrowseBySourceTopResultsListView.Focus(FocusState.Programmatic);
        }
    }
}

关于c# - UWP 阻止 AutosuggestBox 自动聚焦,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45073552/

相关文章:

c# - 数据源更改时未调用 ComboBox SelectedValueChanged

c# - 如何在 .net 中创建动画 gif

c# - 在运行时动态创建按钮并存储,在 C# 中永久检索它

c# - WPF 2 标签宽度响应窗口调整大小

xaml - 无法解析元素上的名称

UWP 链接到串口

xaml - 如何在 Xamarin.Forms 中实现连接动画?

c# - 在C#(全屏游戏)中获取中屏像素(颜色)?

c# - 接收 Google Cloud Messaging (GCM) 推送通知到 UWP Windows 10 应用程序

c# - 将 ContentControl 绑定(bind)到将确定要查看哪个用户控件的 ApplicationViewModel?