Windows Phone 7: Seçilen Liste Kutusu öğesini vurgulayın

Question

Aşağıdaki XAML (özel DataTemplate ile basit liste kutusu) sahibim. Seçilen öğenin nasıl vurgulanacağını anlamaya çalışıyorum (belki arka plan rengi değişimi). Ben Expression Blend Stiller ile bir şey yapmak gerekir ama ben nerede başlamak için emin değilim ... Düzenleme: Biraz oyun oynadıktan sonra şimdi (bu bir şey yapmıyor gibi görünüyor)

<phone:PhoneApplicationPage 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" 
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:Custom="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" 
    x:Class="SqueezeBox.StartPage" 
    d:DataContext="{d:DesignData SampleData/MainViewModelSampleData.xaml}" 
    FontFamily="{StaticResource PhoneFontFamilyNormal}" 
    FontSize="{StaticResource PhoneFontSizeNormal}" 
    Foreground="{StaticResource PhoneForegroundBrush}" 
    SupportedOrientations="Portrait" Orientation="Portrait" 
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="696" 
    shell:SystemTray.IsVisible="True"> 
    <phone:PhoneApplicationPage.Resources> 
     <Style x:Key="HighlightItemStyle" TargetType="ListBoxItem"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="ListBoxItem"> 
         <StackPanel x:Name="DataTemplateStackPanel" Orientation="Horizontal"> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="SelectionStates"> 
            <VisualStateGroup.Transitions> 
             <VisualTransition GeneratedDuration="0" To="Selected"> 
              <Storyboard> 
               <ColorAnimation Duration="0" To="#FFFD0D0D" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="ItemText" d:IsOptimized="True"/> 
              </Storyboard> 
             </VisualTransition> 
            </VisualStateGroup.Transitions> 
            <VisualState x:Name="Unselected"/> 
            <VisualState x:Name="Selected"/> 
            <VisualState x:Name="SelectedUnfocused"/> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
          <Image x:Name="ItemImage" Source="{Binding ThumbnailAlbumArtUri}" Height="62" Width="62" VerticalAlignment="Top" Margin="10,0,20,0"/> 
          <StackPanel x:Name="stackPanel"> 
           <TextBlock x:Name="ItemText" Text="{Binding Name}" Margin="-2,-13,0,0" Style="{StaticResource PhoneTextExtraLargeStyle}" d:IsHidden="True"/> 
           <TextBlock x:Name="DetailsText" Text="{Binding Artist}" Margin="0,-6,0,3" Style="{StaticResource PhoneTextSubtleStyle}"/> 
          </StackPanel> 
         </StackPanel> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 
    </phone:PhoneApplicationPage.Resources> 
    <!--Data context is set to sample data above and LayoutRoot contains the root grid where all other page content is placed--> 
    <Grid x:Name="LayoutRoot" Background="Transparent" d:DataContext="{Binding ServerStatus.Players[0]}" > 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 

     <!--TitlePanel contains the name of the application and page title--> 
     <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="24,24,0,12"> 
      <TextBlock x:Name="ApplicationTitle" Text="Now playing" Style="{StaticResource PhoneTextNormalStyle}"/> 
      <TextBlock x:Name="ListTitle" Text="{Binding PlayerName}" Margin="-3,-8,0,0" Style="{StaticResource PhoneTextTitle1Style}"/> 
      <ProgressBar Visibility="Visible" IsIndeterminate="True" Height="4" HorizontalAlignment="Left" Margin="10,10,0,0" x:Name="progressBar1" VerticalAlignment="Top" Width="460" /> 
     </StackPanel> 

     <!--ContentPanel contains ListBox and ListBox ItemTemplate. Place additional content here--> 
     <Grid x:Name="ContentPanel" Grid.Row="1"> 
      <ListBox x:Name="MainListBox" ItemsSource="{Binding Tracks}" ItemContainerStyle="{StaticResource HighlightItemStyle}" /> 
     </Grid> 
    </Grid> 
</phone:PhoneApplicationPage> 

Answer 1

this post cevabım yardım ediyor mu?

Ekspres Blend üzerinden adresine gitmek için en kolay yol olacağını düşünüyorum. ListBox'a sağ tıklayın (ana kontrol, ürününün değil). Daha sonra "Düzenle Ek Şablonlar .... 'ı (Item Kapsayıcı Tarzı) ...." Düzenle Akım ". Blend, için kablonun stilini değiştirecek yeni bir sayfa yükleyecektir. Sol üst bölmede ( projeyi, varlıkları vb. Seçebilirsiniz) "Devletler" e tıklayın. Durumların bir listesini görürsünüz. Eğer değiştirmek istediklerinizi değiştirin ve umarım bu should eser

DÜZENLEME:

<ControlTemplate TargetType="ListBoxItem"> 
<Border x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}"> 
    <VisualStateManager.VisualStateGroups> 
    <VisualStateGroup x:Name="CommonStates"> 
    <VisualState x:Name="Normal"/> 
    <VisualState x:Name="MouseOver"/> 

    </VisualStateGroup> 
    <VisualStateGroup x:Name="SelectionStates"> 
    <VisualState x:Name="Unselected"> 
    <Storyboard> 
     <ColorAnimation Duration="0" To="White" Storyboard.TargetProperty="(Control.Background).(SolidColorBrush.Color)" Storyboard.TargetName="ContentContainer" d:IsOptimized="True"/> 
     <ColorAnimation Duration="0" To="White" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="ContentContainer" d:IsOptimized="True"/> 
    </Storyboard> 
    </VisualState> 
    <VisualState x:Name="Selected"> 
    <Storyboard> 
     <ColorAnimation Duration="0" To="Red" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="ContentContainer" d:IsOptimized="True"/> 
    </Storyboard> 
    </VisualState> 
    <VisualState x:Name="SelectedUnfocused"> 
    <Storyboard> 
     <ColorAnimation Duration="0" To="Red" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="ContentContainer" d:IsOptimized="True"/> 
    </Storyboard> 
    </VisualState> 
    </VisualStateGroup> 
    </VisualStateManager.VisualStateGroups> 
    <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="#FF1BA1E2" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Background="Black" BorderBrush="Black"/> 
</Border> 
</ControlTemplate>