Photosuru has a neat effect - when you mouseover the thumbnail image a popup opens showing the image enlarged. I am trying to get this to work on a listbox, similar to a tooltip, I need to mouseover an item and have the popup open. The problem, the popup only shows the item selected in the listbox. I tried looking through Photosuru code for the answer, but found it too advanced for me. Note: I can't use tooltip as it is needed for something else.
Here's the xaml:
<Window.Resources>
<XmlDataProvider x:Key="MyPartsXML"
Source="F:\ListBoxSync\MyParts.xml"
XPath="MyParts"
/>
</Window.Resources>
<Grid x:Name="MainGrid" DataContext="{Binding ElementName=PartsList, Path=SelectedItem}" Width="Auto" VerticalAlignment="Stretch">
<ListBox ItemsSource="{Binding Source={StaticResource MyPartsXML}, XPath=//MyParts//parts}"
IsSynchronizedWithCurrentItem="True" Name="PartsList" Foreground="Black" BorderBrush="Black" Width="115" HorizontalAlignment="Left">
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderThickness="2" BorderBrush="Black" Margin="10">
<TextBlock Name="lstbxBlock" Text="{Binding XPath=item}" MouseEnter="item_MouseEnter" MouseLeave="item_MouseLeave"
Width="75" FontSize="16" FontWeight="Bold" Padding="5" ToolTip="{Binding XPath=color}" />
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Popup x:Name="Pops" IsOpen="False" Placement="Right" HorizontalOffset="6" VerticalOffset="0" MinHeight="100" MinWidth="100"
StaysOpen="False" AllowsTransparency="True" PlacementTarget="{Binding ElementName=txtBxitem}" Margin="2" MaxWidth="100" HorizontalAlignment="Left" Width="100">
<StackPanel>
<TextBox Text="{Binding XPath=color}" FontSize="20" FontWeight="Bold" Background="LightBlue" />
<TextBox Text="{Binding XPath=size}" FontSize="20" FontWeight="Bold" Background="LightBlue" />
</StackPanel>
</Popup>
<TextBox Text="{Binding XPath=color}" Margin="12,0,0,63" Height="30" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="75" />
<TextBox Text="{Binding XPath=size}" Margin="12,0,0,27" Height="30" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="75" />
</Grid>
The code behind:
private void item_MouseEnter(object sender, MouseEventArgs e)
{
this.Pops.IsOpen = true;
}
private void item_MouseLeave(object sender, MouseEventArgs e)
{
this.Pops.IsOpen = false;
}
Hope this isn't overkill, but here's the xml:
<?xml version="1.0" encoding="ISO-8859-1" ?>
<MyParts>
<parts>
<item>Part1</item>
<color>Red</color>
<size>SM</size>
</parts>
<parts>
<item>Part2</item>
<color>Green</color>
<size>LG</size>
</parts>
<parts>
<item>Part3</item>
<color>Blue</color>
<size>XXL</size>
</parts>
<parts>
<item>Part4</item>
<color>Yellow</color>
<size>LG</size>
</parts>
<parts>
<item>Part5</item>
<color>Green</color>
<size>XL</size>
</parts>