c# - WPF ListBox 数据绑定(bind)和事件

Question

我的问题很简单。
我有一个包含缩略图(图片)的列表框

<ListBox Name="ListBox_Thumbnails" ItemsSource="{Binding}" DataContext="{Binding Source= {StaticResource ThumbnailListSource}}" Width="120" HorizontalAlignment="Left" Margin="-1,26,0,54">
<ListBox.ItemTemplate>
    <DataTemplate>
        <StackPanel>
            <Image Source="{Binding Path=absolutePath}" MouseLeftButtonDown=<!--?????-->/>
        </StackPanel>
    </DataTemplate>
</ListBox.ItemTemplate>

我想显示一张图片，但作为 StackOverFlow 的新用户，我不能。你可以在这里找到图片:

http://www.freeimagehosting.net/uploads/61aa983cad.jpg

(不信的 friend ，我在这里解释一下图片的内容: 左侧是缩略图列表(垂直显示)，右侧是更大的图像，默认对应于第一个缩略图的大图像。

当我点击缩略图(在左侧)时，右侧的大图像应该更新为我点击的那个。

因为我是 WPF 的新手，所以我的方法对于 ListBox 可能是完全错误的。 WPF 大师，请给我亮光!

Answer 1

我想，您可以在 ListBox 上使用事件，例如 SelectionChanged...但这完全不是真正的 WPF-Jedi 方式——请记住，代码隐藏是阴暗面! =)

想想数据绑定(bind)，这就是原力。将大图像元素的源绑定(bind)到 ListBox 的 SelectedItem 属性。它应该看起来像

<Image Source="{Binding SelectedItem.absolutePath, ElementName=ListBox_Thumbnails}">

附言每个 WPF-databinding-jedi 都应该有 this cheat sheet附近。

附言实际上，当您使用 ItemTemplate 时，这可能不起作用，您会将 StackPanel 作为所选项目...在这种情况下，您可以尝试 the SelectedValuePath trick ，将其设置为“absolutePath”并将大图像绑定(bind)到 SelectedValue 属性。

因此您的 ListBox 起始标记变为:

<ListBox Name="ListBox_Thumbnails" ItemsSource="{Binding}" DataContext="{Binding Source= {StaticResource ThumbnailListSource}}" Width="120" HorizontalAlignment="Left" Margin="-1,26,0,54" SelectedValuePath="absolutePath">

你的大图片标签变成了:

<Image Source="{Binding SelectedValue, ElementName=ListBox_Thumbnails}">