HubSection内でボタンを操作できませんHeaderTemplate

Question

私はHubsectionにTextblockとHeaderTemplateのボタンがあります。それはWindowsの8でOKを動作しますが、私はUWPに、アプリケーションを移行した今、私はボタンをクリックすることはできません。

<HubSection 
Width="480" 
HorizontalAlignment="Stretch" 
Header="_XX" 
IsHeaderInteractive="True"> 
<HubSection.HeaderTemplate> 
    <DataTemplate> 
     <Grid Width="392" Margin="0,-10,0,-10"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition /> 
       <ColumnDefinition /> 
      </Grid.ColumnDefinitions> 

      <TextBlock 
       HorizontalAlignment="Left" 
       VerticalAlignment="Top" 
       FontSize="28" 
       Text="{Binding}" /> 
      <AppBarButton 
       Grid.Column="1" 
       HorizontalAlignment="Right" 
       VerticalAlignment="Top" 
       Command="{Binding ElementName=HubSection, Path=DataContext.MyCommand}"> 
       <AppBarButton.Icon> 
        <FontIcon 
         FontFamily="{StaticResource IconsFontFamily}" 
         FontSize="26" 
         Glyph="&#xE602;" /> 
       </AppBarButton.Icon> 
      </AppBarButton> 
     </Grid> 
    </DataTemplate> 
</HubSection.HeaderTemplate> 
<DataTemplate> 
    ... 
</DataTemplate> 

ヘルプには、事前に感謝を理解されるであろう。

Answer 1

この問題は、ヘッダーの定義方法に起因します。ヘッダーは既にボタンであり、テンプレートでボタン内にボタンを追加しています。

これを解決する1つの解決策はHubテンプレートを複製し、ContentControlによりヘッダをホストするために使用Buttonコントロールを交換することである。

<Page.Resources> 
    <Style TargetType="HubSection"> 
     <Setter Property="HorizontalAlignment" Value="Stretch" /> 
     <Setter Property="VerticalAlignment" Value="Stretch" /> 
     <Setter Property="HorizontalContentAlignment" Value="Left" /> 
     <Setter Property="VerticalContentAlignment" Value="Top" /> 
     <Setter Property="Padding" Value="12,10,12,0" /> 
     <Setter Property="IsTabStop" Value="False" /> 
     <Setter Property="UseSystemFocusVisuals" Value="True" /> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="HubSection"> 
        <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"> 
         <Border.Resources> 
          <ControlTemplate x:Key="HeaderButtonTemplate" TargetType="Button"> 
           <Grid x:Name="ButtonRoot" Background="Transparent"> 
            <VisualStateManager.VisualStateGroups> 
             <VisualStateGroup x:Name="CommonStates"> 
              <VisualState x:Name="Normal"> 
               <Storyboard> 
                <PointerUpThemeAnimation Storyboard.TargetName="ButtonRoot" /> 
               </Storyboard> 
              </VisualState> 
              <VisualState x:Name="PointerOver"> 
               <Storyboard> 
                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
                 <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource HubSectionHeaderButtonForegroundPointerOver}" /> 
                </ObjectAnimationUsingKeyFrames> 
                <PointerUpThemeAnimation Storyboard.TargetName="ButtonRoot" /> 
               </Storyboard> 
              </VisualState> 
              <VisualState x:Name="Pressed"> 
               <Storyboard> 
                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
                 <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource HubSectionHeaderButtonForegroundPressed}" /> 
                </ObjectAnimationUsingKeyFrames> 
                <PointerDownThemeAnimation Storyboard.TargetName="ButtonRoot" /> 
               </Storyboard> 
              </VisualState> 
              <VisualState x:Name="Disabled"> 
               <Storyboard> 
                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
                 <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource HubSectionHeaderButtonForegroundDisabled}" /> 
                </ObjectAnimationUsingKeyFrames> 
               </Storyboard> 
              </VisualState> 
              <VisualState x:Name="ImitatedTextBlock"> 
               <Storyboard> 
                <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
                 <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource HubSectionHeaderForeground}" /> 
                </ObjectAnimationUsingKeyFrames> 
               </Storyboard> 
              </VisualState> 
             </VisualStateGroup> 
            </VisualStateManager.VisualStateGroups> 
            <ContentPresenter x:Name="ContentPresenter" 
            Content="{TemplateBinding Content}" 
            ContentTemplate="{TemplateBinding ContentTemplate}" 
            VerticalAlignment="Center" 
            OpticalMarginAlignment="TrimSideBearings" /> 
           </Grid> 
          </ControlTemplate> 
         </Border.Resources> 
         <Grid Margin="{TemplateBinding Padding}" HorizontalAlignment="Stretch" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition Height="*" /> 
          </Grid.RowDefinitions> 
          <Rectangle x:Name="HubHeaderPlaceholder" Grid.Row="0" /> 
          <Grid Grid.Row="1"> 
           <Grid.ColumnDefinitions> 
            <ColumnDefinition Width="*" /> 
            <ColumnDefinition Width="Auto" /> 
           </Grid.ColumnDefinitions> 
           <!-- The change is here --> 
           <ContentControl x:Name="HeaderButton" 
           Grid.Row="1" 
           Grid.Column="0" 
           UseSystemFocusVisuals="True" 
           Content="{TemplateBinding Header}" 
           ContentTemplate="{TemplateBinding HeaderTemplate}" 
           Foreground="{ThemeResource HubSectionHeaderButtonForeground}" 
           Margin="{ThemeResource HubSectionHeaderThemeMargin}" 
           FontSize="{ThemeResource HubSectionHeaderThemeFontSize}" 
           FontWeight="{ThemeResource HubSectionHeaderThemeFontWeight}" 
           HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
           VerticalAlignment="Bottom" 
           IsTabStop="False" /> 
           <Button x:Name="SeeMoreButton" 
           Grid.Row="1" 
           Grid.Column="1" 
           UseSystemFocusVisuals="True" 
           Visibility="Collapsed" 
           HorizontalAlignment="Right" 
           VerticalAlignment="Bottom" 
           Foreground="{ThemeResource HubSectionHeaderButtonForeground}" 
           Margin="{ThemeResource HubSectionHeaderSeeMoreThemeMargin}" 
           Template="{StaticResource HeaderButtonTemplate}" 
           FontSize="{ThemeResource HubSectionHeaderSeeMoreThemeFontSize}" 
           FontWeight="{ThemeResource HubSectionHeaderThemeFontWeight}" /> 
          </Grid> 
          <ContentPresenter x:Name="ContentPresenter" 
          ContentTemplate="{TemplateBinding ContentTemplate}" 
          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
          VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
          Grid.Row="2" /> 
         </Grid> 
        </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Page.Resources>