Le menu de débordement CommandBar ne détecte pas les prises

Question

J'ai un CommandBar. La partie principale fonctionne, y compris la détection des robinets. Le menu de débordement affiche les noms des onglets, mais lorsque j'appuie sur l'un des onglets, rien ne se passe et je ne vois aucun code déclencher. Qu'est-ce que je rate?

<Page 
     x:Class="Jockusch.Calculator.WindowsStore.MainPage" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="using:Jockusch.Calculator.WindowsStore" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:system="using:System" 
     mc:Ignorable="d"> 
    <Page.TopAppBar> 
     <CommandBar x:Name="TabBar"> 
      <CommandBar.PrimaryCommands> 
      </CommandBar.PrimaryCommands> 
      <CommandBar.SecondaryCommands> 
      </CommandBar.SecondaryCommands> 
     </CommandBar> 
    </Page.TopAppBar> 
    <Grid Background="White" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" x:Name="PageGrid"> 
     <local:WindowsAdAndContentWrapperView Grid.Row="0" Grid.Column="0" x:Name="ContentView"></local:WindowsAdAndContentWrapperView> 
    </Grid> 
</Page> 

Code de configuration de la barre de commande qui se déclenche peu de temps après le lancement de l'application. Il y a beaucoup d'onglets, donc certains d'entre eux sont poussés dans le menu de débordement. Ceux qui restent dans le menu principal fonctionnent bien.

static class WindowsTabContextAdditions 
{ 
    public static void SetupWindowsCommandBar(this TabContext context, CommandBar bar) 
    { 
    // TabContext and Tab are both my custom classes. 
    foreach (Tab tab in context.Tabs) 
    { 
     AppBarButton button = new AppBarButton(); 
     IconElement icon = IconElements.ForTab(tab); 
     button.Label = tab.DisplayString; 
     button.Icon = icon; 
     bar.PrimaryCommands.Add(button); 
    } 
    } 
} 

static class IconElements 
{ 
    public const string IconPathPrefix = @"ms-appx:///Images/"; 
    public static IconElement ForTab(Tab tab) 
    { 
    BitmapIcon r = null; 
    string name = tab.WindowsBitmapName(); 
    string path = IconPathPrefix + name + ".png"; 
    r = new TabBitmapIcon(tab); 
    r.UriSource = new Uri(path); 
    r.Tapped += Icon_Tapped;  
    return r; 
    } 


    private static void Icon_Tapped(Object sender, TappedRoutedEventArgs e) 
    { 
    // This method fires when the tab is selected. For the non-overflow ones, it works. 
    MyDebuggingClass.WriteLine("Tap detected!"); 
    } 
} 

Answer 1

En général, la collection SecondaryCommands ne peut contenir que AppBarButton, AppBarToggleButton, ou des éléments de commande AppBarSeparator. Les icônes ne sont pas affichées par défaut.

Source de MSDN Document CommandBar.SecondaryCommands property

Donc, si l'icône n'a pas été démontré, il ne serait pas tirer le robinet event.If vous voulez tirer événement Tap, vous devez faire spectacle d'icônes en premier.

J'ai suivi la suggestion de DamirArh dans ce fil Show icon on SecondaryCommands (UWP) pour que les commandes secondaires affichent les icônes. Ensuite, j'ai enregistré l'événement Tap pour BitmapIcon. Cela a bien fonctionné. Lorsque je clique sur Icône, l'événement Tap sera déclenché.

Vous pouvez vous référer à mon code de référence:

<Page.Resources> 
    <Style x:Key="AppBarButtonStyle1" TargetType="AppBarButton"> 
     <Setter Property="Background" Value="{ThemeResource AppBarButtonBackground}" /> 
     <Setter Property="Foreground" Value="{ThemeResource AppBarButtonForeground}" /> 
     <Setter Property="BorderBrush" Value="{ThemeResource AppBarButtonBorderBrush}" /> 
     <Setter Property="HorizontalAlignment" Value="Left" /> 
     <Setter Property="VerticalAlignment" Value="Top" /> 
     <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" /> 
     <Setter Property="FontWeight" Value="Normal" /> 
     <Setter Property="Width" Value="68" /> 
     <Setter Property="UseSystemFocusVisuals" Value="True" /> 
     <Setter Property="AllowFocusOnInteraction" Value="False" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="AppBarButton"> 
        <Grid x:Name="Root" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" MaxWidth="{TemplateBinding MaxWidth}" MinWidth="{TemplateBinding MinWidth}"> 
         <Grid.Resources> 
          <Style x:Name="LabelOnRightStyle" TargetType="AppBarButton"> 
           <Setter Property="Width" Value="NaN" /> 
          </Style> 
         </Grid.Resources> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="ApplicationViewStates"> 
           <VisualState x:Name="FullSize" /> 
           <VisualState x:Name="Compact"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="LabelOnRight"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Content"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="12,14,0,14" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="MinHeight" Storyboard.TargetName="ContentRoot"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarThemeCompactHeight}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.Row)" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="0" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Grid.Column)" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="1" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="TextAlignment" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Left" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="8,15,12,17" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="LabelCollapsed"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="MinHeight" Storyboard.TargetName="ContentRoot"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarThemeCompactHeight}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Overflow"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ContentRoot"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="OverflowContentRoot"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="OverflowWithToggleButtons"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ContentRoot"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="OverflowTextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="OverflowTextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="38,0,12,0" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"> 
            <Storyboard> 
             <PointerUpThemeAnimation Storyboard.TargetName="OverflowTextLabel" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="PointerOver"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonBackgroundPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonBorderBrushPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="Content"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="OverflowTextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <PointerUpThemeAnimation Storyboard.TargetName="OverflowTextLabel" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Pressed"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonBackgroundPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonBorderBrushPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="Content"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="OverflowTextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundPressed}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <PointerDownThemeAnimation Storyboard.TargetName="OverflowTextLabel" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="Root"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonBackgroundDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="Root"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonBorderBrushDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="Content"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="TextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="OverflowTextLabel"> 
              <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonForegroundDisabled}" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
          <VisualStateGroup x:Name="InputModeStates"> 
           <VisualState x:Name="InputModeDefault" /> 
           <VisualState x:Name="TouchInputMode"> 
            <VisualState.Setters> 
             <Setter Target="OverflowTextLabel.Padding" Value="0,11,0,13" /> 
            </VisualState.Setters> 
           </VisualState> 
           <VisualState x:Name="GameControllerInputMode"> 
            <VisualState.Setters> 
             <Setter Target="OverflowTextLabel.Padding" Value="0,11,0,13" /> 
            </VisualState.Setters> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Grid x:Name="ContentRoot" MinHeight="{ThemeResource AppBarThemeMinHeight}"> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition Width="*" /> 
           <ColumnDefinition Width="Auto" /> 
          </Grid.ColumnDefinitions> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition Height="Auto" /> 
          </Grid.RowDefinitions> 
          <ContentPresenter x:Name="Content" AutomationProperties.AccessibilityView="Raw" Content="{TemplateBinding Icon}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Stretch" Height="20" Margin="0,14,0,4" /> 
          <TextBlock x:Name="TextLabel" Foreground="{TemplateBinding Foreground}" FontSize="12" FontFamily="{TemplateBinding FontFamily}" Margin="2,0,2,6" Grid.Row="1" TextAlignment="Center" TextWrapping="Wrap" Text="{TemplateBinding Label}" /> 
         </Grid> 
         <StackPanel x:Name="OverflowContentRoot" Orientation="Horizontal" Visibility="Collapsed" MinHeight="{ThemeResource AppBarThemeCompactHeight}"> 
          <ContentPresenter x:Name="OverflowContent" AutomationProperties.AccessibilityView="Raw" Content="{TemplateBinding Icon}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Stretch" Height="20" Margin="0,14,0,4" /> 
          <TextBlock x:Name="OverflowTextLabel" Foreground="{TemplateBinding Foreground}" FontSize="15" FontFamily="{TemplateBinding FontFamily}" HorizontalAlignment="Stretch" Margin="12,0,12,0" Padding="0,5,0,7" TextAlignment="Left" TextWrapping="NoWrap" Text="{TemplateBinding Label}" TextTrimming="Clip" VerticalAlignment="Center" /> 
         </StackPanel> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Page.Resources> 
<Page.TopAppBar> 
    <CommandBar x:Name="TabBar"> 
     <CommandBar.PrimaryCommands> 
     </CommandBar.PrimaryCommands> 
     <CommandBar.SecondaryCommands> 
      <AppBarButton Style="{StaticResource AppBarButtonStyle1}"> 
       <AppBarButton.Icon> 
        <BitmapIcon UriSource="Assets/StoreLogo.png" Tapped="Icon_Tapped"></BitmapIcon> 
       </AppBarButton.Icon> 
      </AppBarButton> 
     </CommandBar.SecondaryCommands> 
    </CommandBar> 
</Page.TopAppBar>