2009-04-27 18 views
14

Scusate se è stato chiesto in precedenza, ma non sono riuscito a trovare una soluzione a ciò che sto cercando nelle domande correlate che sono spuntate o su Google.Colore selezione ListBox WPF

Nella mia applicazione sto cercando di ricreare la finestra di dialogo Words New Document, elenco a sinistra degli elementi e sulla destra un'icona con il testo sottostante. In Word ha il gradiente arancione quando si passa il mouse sopra e un gradiente più scuro quando si seleziona un elemento. Ho ricreato la maggior parte di questo, tranne che per cambiare il colore di sfondo una volta selezionato un oggetto. Ecco il codice che sto usando per creare questa:

<ListView Margin="236,34,17,144" Name="listView1" HorizontalContentAlignment="Stretch"> 
     <ListView.ItemsPanel> 
      <ItemsPanelTemplate> 
       <UniformGrid Columns="5" IsItemsHost="True" VerticalAlignment="Top" > 
       </UniformGrid> 
      </ItemsPanelTemplate> 
     </ListView.ItemsPanel> 
     <ListView.ItemTemplate> 
      <DataTemplate > 
       <StackPanel HorizontalAlignment="Center" Width="auto"> 
        <Image Source="images/document32.png" HorizontalAlignment="Center"/> 
        <TextBlock Text="{Binding}" HorizontalAlignment="Center" /> 
       </StackPanel> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
     <ListView.ItemContainerStyle> 
      <Style TargetType="{x:Type ListViewItem}" >     
       <Style.Triggers> 
        <Trigger Property="IsSelected" Value="true"> 
         <Setter Property="Foreground" Value="Yellow" /> 
         <Setter Property="Background" Value="Orange" /> 
        </Trigger> 
        <Trigger Property="IsMouseOver" Value="true"> 
         <Setter Property="Foreground" Value="Black" /> 
         <Setter Property="Background"> 
          <Setter.Value> 
           <LinearGradientBrush EndPoint="0.5,1" StartPoint="1,0"> 
            <GradientStop Color="#d3e7ff" Offset="0.986"/> 
            <GradientStop Color="#b0d2fc" Offset="0.5"/> 
            <GradientStop Color="#8ec1ff" Offset="0.51"/> 
           </LinearGradientBrush> 
          </Setter.Value> 
         </Setter> 
        </Trigger> 

       </Style.Triggers> 
      </Style> 
     </ListView.ItemContainerStyle> 
    </ListView> 

Quindi questo crea l'aspetto Vado a fare, fa il mouse sopra, e quando seleziono un elemento nella listview cambierà il testo caratteri da Giallo, ma si rifiuta di cambiare lo sfondo dal blu di default all'arancio, e idealmente sarebbe comunque un altro gradiente e non un colore pieno. Grazie per qualsiasi aiuto.

risposta

31

Ci sono alcuni hack che puoi fare come sovrascrivere la chiave colore del sistema, ma molto probabilmente vorrai fornire un nuovo modello per raggiungere questo obiettivo. Ecco un bell'aspetto che ho messo insieme:

<Style x:Key="ListboxItemStyle" TargetType="{x:Type ListBoxItem}"> 
    <Setter Property="Margin" Value="1,2,1,1"/> 
    <Setter Property="HorizontalAlignment" Value="Stretch" /> 
    <Setter Property="Background" Value="{StaticResource NormalItemBackground}" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type ListBoxItem}"> 
       <Grid> 
        <Border Background="{TemplateBinding Background}" /> 
        <Border Background="#BEFFFFFF" Margin="3,1"> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition /> 
           <RowDefinition /> 
          </Grid.RowDefinitions> 
          <Border Margin="2,1,2,0" Grid.Row="0" Background="#57FFFFFF" /> 
         </Grid> 
        </Border> 
        <ContentPresenter Margin="8,5" /> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <MultiTrigger> 
         <MultiTrigger.Conditions> 
          <Condition Property="IsMouseOver" Value="True" /> 
          <Condition Property="IsSelected" Value="False"/> 
         </MultiTrigger.Conditions> 
         <Setter Property="Background" Value="{StaticResource HotItemBackground}" /> 
        </MultiTrigger> 
        <Trigger Property="IsSelected" Value="True"> 
         <Setter Property="Background" Value="{StaticResource SelectedItemBackground}" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 
<Style x:Key="ListBoxStyle" TargetType="{x:Type ListBox}"> 
    <Setter Property="ItemContainerStyle" Value="{DynamicResource ListboxItemStyle}" /> 
    <Setter Property="Margin" Value="3,3,2,1" /> 
</Style>