0

我有一个image内部 a 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，用户可以使用鼠标滚轮放大和缩小并单击和拖动以平移图像。在我们缩放到所需区域后，我仍然希望允许这样做。

更新： 我已经尝试实现科林史密斯的答案，但是每当我更改滚动查看器的偏移量时，它都会切割图像，所以如果我稍后移动（单击并拖动以平移）它，它就是空白空间。我以前只使用滚动查看器内的图像进行此工作，但现在我在边框内的滚动查看器内有一个图像。因为我现在已经设置了边框，所以我的缩放和平移需要边框。

我更新的 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);
      }
}
4

1 回答 1

0

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

<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/ScrollToHorizo​​ntalOffset。

于 2012-09-08T15:13:37.597 回答