trigger style modern for wpf styles

style - wpf templates free



Cambiar el color de fondo para el elemento de ListBox seleccionado (7)

Necesita usar ListBox.ItemContainerStyle .

ListBox.ItemTemplate especifica cómo se debe mostrar el contenido de un elemento. Pero WPF todavía envuelve cada elemento en un control ListBoxItem, que de forma predeterminada obtiene su fondo establecido en el color de resaltado del sistema, si está seleccionado. No puede evitar que WPF cree los controles ListBoxItem, pero puede personalizarlos, en su caso, para configurar el fondo para que siempre sea transparente o negro o lo que sea, y para hacerlo, use ItemContainerStyle.

La respuesta de juFo muestra una posible implementación, mediante el "secuestro" del recurso de pincel de fondo del sistema en el contexto del estilo del elemento; otra técnica, quizás más idiomática, es utilizar un Setter para la propiedad Background.

Este es mi XAML hasta ahora.

<ScrollViewer Grid.Column="1" Grid.RowSpan="2"> <ListBox Background="Black" ItemsSource="{Binding Path=ActiveLog}" > <ListBox.ItemTemplate> <DataTemplate> <Grid Background="Black"> <Grid.ColumnDefinitions> <ColumnDefinition Width="200"></ColumnDefinition> <ColumnDefinition Width="*"></ColumnDefinition> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition></RowDefinition> <RowDefinition></RowDefinition> </Grid.RowDefinitions> <TextBlock Grid.Column="0" Grid.Row="0" Foreground="White"> <TextBlock >Date:</TextBlock> <TextBlock Text="{Binding Path=LogDate}"/> </TextBlock> <TextBlock Grid.Column="1" Grid.Row="0" Foreground="White"> <TextBlock >Severity:</TextBlock> <TextBlock Text="{Binding Path=Severity}"/> </TextBlock> <TextBlock Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="1" Foreground="LightGray" Text="{Binding Path=Message}"></TextBlock> </Grid> </DataTemplate> </ListBox.ItemTemplate> <ListBox.Template> <ControlTemplate> <StackPanel Background="Black" IsItemsHost="True" > </StackPanel> </ControlTemplate> </ListBox.Template> </ListBox> </ScrollViewer>

El único problema es que el elemento seleccionado tiene un cuadro azul a la derecha. Supongo que hay una forma de cambiar el color de selección, pero no puedo encontrarlo.


O puede aplicar HighlightBrushKey directamente al ListBox. Setter Property = "Background" Value = "Transparent" NO funcionó. Pero tuve que configurar el primer plano en negro.

<ListBox ... > <ListBox.ItemContainerStyle> <Style TargetType="ListBoxItem"> <Style.Triggers> <Trigger Property="IsSelected" Value="True" > <Setter Property="FontWeight" Value="Bold" /> <Setter Property="Background" Value="Transparent" /> <Setter Property="Foreground" Value="Black" /> </Trigger> </Style.Triggers> <Style.Resources> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/> </Style.Resources> </Style> </ListBox.ItemContainerStyle>


Si la selección no es importante, es mejor usar un ItemsControl envuelto en un ScrollViewer. Esta combinación es más liviana que el Listbox (que en realidad se deriva de ItemsControl ya) y su uso eliminaría la necesidad de utilizar un hack barato para anular el comportamiento que ya está ausente de ItemsControl.

En los casos en que el comportamiento de selección ES realmente importante, obviamente esto no funcionará. Sin embargo, si desea cambiar el color del Fondo del elemento seleccionado de tal manera que no sea visible para el usuario, eso solo serviría para confundirlos. En los casos donde su intención es cambiar alguna otra característica para indicar que el elemento está seleccionado, algunas de las otras respuestas a esta pregunta pueden ser aún más relevantes.

Aquí hay un esquema de cómo debería verse el marcado:

<ScrollViewer> <ItemsControl> <ItemsControl.ItemTemplate> <DataTemplate> ... </DataTemplate> </ItemsControl.ItemTemplate> </ItemsControl> </ScrollViewer>


Tienes que crear una nueva plantilla para la selección de elementos como esta.

<Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ListBoxItem"> <Border BorderThickness="{TemplateBinding Border.BorderThickness}" Padding="{TemplateBinding Control.Padding}" BorderBrush="{TemplateBinding Border.BorderBrush}" Background="{TemplateBinding Panel.Background}" SnapsToDevicePixels="True"> <ContentPresenter Content="{TemplateBinding ContentControl.Content}" ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" HorizontalAlignment="{TemplateBinding Control.HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding Control.VerticalContentAlignment}" SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" /> </Border> </ControlTemplate> </Setter.Value> </Setter>


Tuve que configurar HighlightBrushKey y ControlBrushKey para que se diseñase correctamente. De lo contrario, mientras tenga foco, usará correctamente la tecla HighlightBrusKey transparente. Bt, si el control pierde el foco (mientras todavía está resaltado), entonces usa la tecla ControlBrush.

<Style.Resources> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent" /> <SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}" Color="Transparent" /> </Style.Resources>

Espero que esto ayude a alguien.


<Style.Resources> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/> </Style.Resources>

Este código funcionó como un encanto para mí. Gracias al cartel original.


<UserControl.Resources> <Style x:Key="myLBStyle" TargetType="{x:Type ListBoxItem}"> <Style.Resources> <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/> </Style.Resources> </Style> </UserControl.Resources>

y

<ListBox ItemsSource="{Binding Path=FirstNames}" ItemContainerStyle="{StaticResource myLBStyle}">

Simplemente anula el estilo de listboxitem (vea: TargetType es ListBoxItem)