UWP - StackPanelコンテンツでListBoxItemStyleをカスタマイズする

Question

UWP-XAMLのListBoxItemのスタイリングコンセプトに苦しんでいます。

私が欲しいのは、2つのTextBlocksのStackPanelで構成されるItemsを持つListBoxのスタイルです。 2つのTextBlockのForegroundは、PressedSelectedの場合とは異なります。

次のListBoxの例では、標準のListBoxItemStyleでContentPresenterのみをスタイルすることができ、両方のTextBlocksが一緒に変更されます。

<ListBox> 
    <ListBox.ItemTemplate> 
     <DataTemplate x:DataType="local:DataSet"> 
      <StackPanel> 
       <TextBlock x:Name="number" Text="{x:Bind Number}"/> 
       <TextBlock x:Name="name" Text="{x:Bind Name}"/> 
      </StackPanel> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox> 

Answer 1

ItemContainerのスタイルを編集する必要があります。 ContentPresenterをstackpanelとその内容に置き換えます。しかし、私はx：Bindの代わりにBindingを使用しました。 x：スタイル内にバインドすることはできないようです。

<Style TargetType="ListBoxItem" x:Key="ListViewStyle"> 
      <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" /> 
      <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" /> 
      <Setter Property="Background" Value="Transparent"/> 
      <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}" /> 
      <Setter Property="TabNavigation" Value="Local"/> 
      <Setter Property="IsHoldingEnabled" Value="True"/> 
      <Setter Property="Padding" Value="12,0,12,0"/> 
      <Setter Property="HorizontalContentAlignment" Value="Left"/> 
      <Setter Property="VerticalContentAlignment" Value="Center"/> 
      <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}"/> 
      <Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}"/> 
      <Setter Property="UseSystemFocusVisuals" Value="True" /> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="ListBoxItem"> 
         <Grid x:Name="ContentBorder" 
       Background="{TemplateBinding Background}" 
       BorderBrush="{TemplateBinding BorderBrush}" 
       BorderThickness="{TemplateBinding BorderThickness}"> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="CommonStates"> 
            <VisualState x:Name="Normal"> 
            </VisualState> 
            <VisualState x:Name="PointerOver"> 
            </VisualState> 
            <VisualState x:Name="Pressed"> 
            </VisualState> 
            <VisualState x:Name="Selected"> 
             <Storyboard> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
               <DiscreteObjectKeyFrame KeyTime="0" Value="Red" /> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter1" Storyboard.TargetProperty="Foreground"> 
               <DiscreteObjectKeyFrame KeyTime="0" Value="Yellow" /> 
              </ObjectAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="SelectedPointerOver"> 
            </VisualState> 
            <VisualState x:Name="SelectedUnfocused"> 
             <Storyboard> 

              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
               <DiscreteObjectKeyFrame KeyTime="0" Value="Red" /> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter1" Storyboard.TargetProperty="Foreground"> 
               <DiscreteObjectKeyFrame KeyTime="0" Value="Yellow" /> 
              </ObjectAnimationUsingKeyFrames> 

             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="SelectedPressed"> 
             <Storyboard> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="Red" /> 
               </ObjectAnimationUsingKeyFrames> 
               <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter1" Storyboard.TargetProperty="Foreground"> 
                <DiscreteObjectKeyFrame KeyTime="0" Value="Yellow" /> 
               </ObjectAnimationUsingKeyFrames> 

             </Storyboard> 
            </VisualState> 
           </VisualStateGroup> 
           <VisualStateGroup x:Name="DisabledStates"> 
            <VisualState x:Name="Enabled"/> 
            <VisualState x:Name="Disabled"> 
            </VisualState> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
          <Rectangle x:Name="BorderBackground" 
        IsHitTestVisible="False" 
        Fill="{ThemeResource SystemControlHighlightListAccentLowBrush}" 
        Opacity="0" 
        Control.IsTemplateFocusTarget="True"/> 
          <StackPanel Background="Transparent" 
       Margin="0,0,0,0"> 
           <TextBlock x:Name="ContentPresenter" Text="{Binding Number}"/> 
           <TextBlock Grid.Column="1" x:Name="ContentPresenter1" Text="{Binding Name}"/> 
          </StackPanel> 

         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 



<ListBox ItemContainerStyle="{StaticResource ListViewStyle}" x:Name="listview"> 
      <ListBox.ItemTemplate> 
       <DataTemplate> 
        <StackPanel/> 
       </DataTemplate> 
      </ListBox.ItemTemplate> 
     </ListBox>