Question

我在image内有一个border，我想在不同的时间在图像框中显示图像源的不同部分。具体来说，当某个文本框获得焦点时，我想更改图像，使其缩放到图像内容的某个部分。

这是XAML：

<Border BorderBrush="Silver" BorderThickness="1" Grid.Column="5" Height="504"   
   HorizontalAlignment="Left" Margin="20,116,0,0" Name="border1"  
   VerticalAlignment="Top" Width="410" ClipToBounds="True">
   <Image Height="493" Name="image5" Stretch="Fill" Width="390" 
       ClipToBounds="True" BindingGroup="{Binding}" 
       Clip="{Binding ElementName=border1}" 
       Cursor="Hand" StretchDirection="Both" />
</Border>

例如，我的图像源是2550 x 3320像素。我希望image框在一个矩形中显示源，从1755,300点开始，宽度为650，高度为230.我不想使用CloneBitmap将该矩形切出并显示它，因为我也是为此image设置手动缩放设置，用户可以使用鼠标滚轮放大和缩小，然后点击＆amp;拖动以平移图像。在我们缩放到所需区域后，我仍然希望允许这样做。

更新我已经尝试过实施colinsmith的答案，但每当我更改滚动查看器的偏移时，它会切换图像，所以如果我稍后移动（点击并拖动以平移）它，它就会空的空间。我之前只使用了scrollviewer中的图像，但是现在我在边框内的滚动查看器中有一个图像。我现在已经设置了缩放和平移所需的边框。

我更新的XAML：

<Border BorderBrush="Silver" BorderThickness="1" Grid.Column="5" Height="504" 
   HorizontalAlignment="Left" Margin="20,116,0,0" Name="border1"   
   VerticalAlignment="Top" Width="410" ClipToBounds="True">

   <ScrollViewer x:Name="image5scroll" VerticalScrollBarVisibility="Hidden" 
      HorizontalScrollBarVisibility="Hidden">
      <Image Height="493" Name="image5" Stretch="Fill" Width="390" 
         ClipToBounds="True" BindingGroup="{Binding}" 
         Clip="{Binding ElementName=image5scroll}" Cursor="Hand" 
         StretchDirection="Both" />
   </ScrollViewer>
</Border>

代码背后：

public void imageZoom(Element element, int index)
{
   if (element.Rectangle.Left - 100 > 0)
   {
      image5scroll.ScrollToHorizontalOffset(element.Rectangle.Left - 100);
      image5scroll.Width = element.Rectangle.Width + 200;
      image5scroll.Height = element.Rectangle.Height + 200;
      border1.Width = image5scroll.Width;
      border1.Height = image5scroll.Height;
      image5.Width = image5scroll.Width;
      image5.Height = image5scroll.Height;
      image5.Stretch = System.Windows.Media.Stretch.None;
   }
   else
     {
        image5scroll.ScrollToHorizontalOffset(0);
     }

   if (element.Rectangle.Top - 100 > 0)
   {
      image5scroll.ScrollToVerticalOffset(element.Rectangle.Top - 100);
   }
   else
      {
         image5scroll.ScrollToVerticalOffset(0);
      }
}

Answer 1

您可以使用ScrollViewer来包装您的图像...然后您可以通过调用ScrollToVerticalOffset()和ScrollToHorizontalOffset()方法告诉ScrollViewer转到垂直和水平偏移（因为没有您可以设置的属性。）

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Grid>  
        <Border BorderBrush="Silver" BorderThickness="1" Grid.Column="5" Height="504"
        HorizontalAlignment="Left" Margin="20,116,0,0" Name="border1" VerticalAlignment="Top" Width="410">
        <ScrollViewer x:Name="image5scroll" VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden">
            <Image Height="493" Name="image5" Stretch="None" Width="390" BindingGroup="{Binding}"
            Cursor="Hand" Source="http://www.noaanews.noaa.gov/stories/images/goes-12-firstimage-large081701.jpg"/>
        </ScrollViewer>
        </Border>  
  </Grid>
</Page>

但是，如果您必须能够使用属性而不是代码隐藏来设置ScrollViewer的位置，那么解决方案是定义一个附加属性，它将为您调用ScrollToVerticalOffset / ScrollToHorizontalOffset。

http://marlongrech.wordpress.com/2009/09/14/how-to-set-wpf-scrollviewer-verticaloffset-and-horizontal-offset/

使用代码缩放和移动图像

1 个答案: