将一个控件的图像源设置为wpf中另一个控件的图像源

时间:2014-10-06 02:04:42

标签: wpf binding triggers

我在WPF中有5个用于缩略图视图的图像控件和1个用于放大视图的图像控件。

我想将EnlargedImageControl源属性设置为Hover上5个缩略图图像源之一的来源

<Image Source="{Binding DataContext.PassportSizeImage, ElementName=Root}"/>
<Image Source="{Binding DataContext.PassportImage, ElementName=Root}"/>
<Image Source="{Binding DataContext.VisaImage, ElementName=Root}"/>
<Image Source="{Binding DataContext.SSNImage, ElementName=Root}"/>
<Image Source="{Binding DataContext.BarCodeImage, ElementName=Root}">

当在上面5个图像中的任何一个上拍摄鼠标时,我需要将该图像的source属性设置为下面的ZoomImage的source属性。

--Set ZoomImage source equal to image last hovered above.
<Image Name="ZoomImage" Source="{Binding DataContext.BarCodeImage, ElementName=Root}">

1 个答案:

答案 0 :(得分:0)

我没有足够的英语来解释细节 我希望你能理解我说的话。无论如何,你应该只使用xaml的绑定吗?如果你使用事件处理程序,我认为它们很简单。

您可以使用事件处理程序,例如

private void Image_MouseEnter(object sender, RoutedEventArgs e)
{
  // TODO:
  // Set Image.
}

private void Image_MouseLeave(object sender, RoutedEventArgs e)
{
  // TODO:
  // Reset image.
}


但它可能是线程不安全的,所以我建议 IsMouseDirectlyOverChanged 事件。
它是 DependencyPropertyChangedEvent ,你可以像下面一样使用它,

<!-- *.xaml file -->
<UserControl x:Class=... ... ... ...
             ... ... ... ... ... ...
             x:Name="FaverName"
             Width="..." Height="...">
  <!-- 
    ...
  -->
  <StackPanel x:Name="StackPanel_Images">
    <Image Source="{Binding ElementName=Root, Path=DataContext.PassportSizeImage}"/>
    <Image Source="{Binding ElementName=Root, Path=DataContext.PassportImage}"/>
    <Image Source="{Binding ElementName=Root, Path=DataContext.VisaImage}"/>
    <Image Source="{Binding ElementName=Root, Path=DataContext.SSNImage}"/>
    <Image Source="{Binding ElementName=Root, Path=DataContext.BarCodeImage}">
  </StackPanel>
  <!-- 
    ...
  -->
  <!-- This control is target. -->
  <Image Source="{Binding ElementName="FaverName", Path="ZoomedImageSource}"/>
</UserControl>


然后,代码背后。

// .cs file
// DependencyProperty for binding.
static public readonly DependencyProperty ZoomedImageSourceProperty = DependencyProperty.Register("ZoomedImageSource", typeof(ImageSource), typeof(YourUserControl));
public ImageSource ZoomedImageSource
{
  get { return GetValue(ZoomedImageSourceProperty) as ImageSource; }
  set { SetValue(ZoomedImageSourceProperty, value); }
}

public YourUserControl()
{
  // ...

  // Chain new event.
  foreach(Image item in StackPanel_Images.Children)
  {
    item.IsMouseDirectlyOverChanged += (s, e)=>
    {
      if((bool)e.NewValue)
        ZoomedImageSource = (s as Image).Source;
    }
  }
}
// ...