WPF ListBox DataTemplate e Imagen pregunta

Question

Tengo un ListBox con un StackPanel que contiene una imagen y la etiqueta.

<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <VirtualizingStackPanel Orientation="Horizontal" IsItemsHost="True" />
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
    <DataTemplate>
        <StackPanel Orientation="Vertical">
            <Image Source="{Binding Image}" Cursor="Hand" Tag="{Binding Link}" MouseLeftButtonDown="Image_MouseLeftButtonDown" ToolTip="Click to see this product on adidas.com" VerticalAlignment="Top" HorizontalAlignment="Left"  />
            <Label Content="{Binding Name}" Cursor="Hand" Tag="{Binding Link}" MouseLeftButtonDown="Label_MouseLeftButtonDown" VerticalAlignment="Bottom" Foreground="White" Style="{StaticResource Gotham-Medium}" FontSize="8pt"  HorizontalAlignment="Center" />
        </StackPanel>
    </DataTemplate>
</ListBox.ItemTemplate>

Quiero mostrar una tercera imagen (glow.png) detrás de la imagen actualmente ratón por encima. Me parece que no puede añadir una segunda imagen en el panel de pila, y establecer su visibilidad a oculto. Ni siquiera he abordado la parte mouseover todavía.

es la adición de otra imagen dentro del panel de pila y después configurar la visibilidad es visible para el enfoque correcto en MouseEnter y, a continuación, de nuevo en el intercambio mouseleave?

Gracias.

Answer 1

Por supuesto que puede tener una imagen detrás de otro. En lugar de añadir directamente la imagen en su StackPanel, añadir una rejilla y luego añadir las dos imágenes, así:

<StackPanel Orientation="Vertical">
    <Grid>
        <Image Source="..." />
        <Image Source="{Binding Image}" ... />
    </Grid>
    <Label Content="{Binding Name}" ... />
</StackPanel>

También te mirar en efectos de imagen , usando que se puede introducir un efecto "brillo" a cualquier elemento de WPF.

Editar Otra forma de lograr el efecto deseado (creo) es que cambiar la propiedad Fuente de la imagen en un disparador. No voy a tratar de escribir el código XAML de la memoria aquí, pero se puede coger la propiedad IsMouseOver de la imagen en sí, y cuando se cambia a True usted podría fijar su nacimiento hasta la "brillante" versión de la imagen.

Answer 2

Otra posibilidad es añadir un borde a su imagen, ajustar el color de la BorderBrush a lo que usted quiere y la opacidad a 0. En el controlador de eventos MouseEnter establecer la opacidad a 1.