WPF滾動查看器概述控件

Question

在我的WPF應用程序中我使用滾動查看器來顯示圖表。 該圖可能相當大且複雜，通常您只能在Scrollviewer控件中看到圖的一個智能部分。

爲了便於圖表導航，我將創建一個應該包含整個圖表圖片的控件。如果您在此控件中點擊特定位置，滾動查看器應該將圖表滾動到這個位置。

Something like that

什麼是做到這一點的最簡單的方法？ 非常感謝併爲我可怕的英語感到難過。

Answer 1

XAML：

<Grid> 
    <ScrollViewer x:Name="TheScrollViewer" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"> 
     <Image x:Name="FullImage" Source="Test.jpg" Stretch="None"></Image> 
    </ScrollViewer> 
    <Border BorderBrush="Red" BorderThickness="1" VerticalAlignment="Bottom" HorizontalAlignment="Right"> 
     <Image x:Name="ThumbnailImage" Height="100" Source="Test.jpg" MouseDown="ThumbnailImage_OnMouseDown"/> 
    </Border> 
</Grid> 

代碼隱藏：

private void ThumbnailImage_OnMouseDown(object sender, MouseButtonEventArgs e) 
{ 
    var position = e.GetPosition(ThumnailImage); 

    var horOffset = position.X/ThumnailImage.ActualWidth * FullImage.ActualWidth; 
    var verOffset = position.Y/ThumnailImage.ActualHeight * FullImage.ActualHeight; 

    TheScrollViewer.ScrollToHorizontalOffset(horOffset); 
    TheScrollViewer.ScrollToVerticalOffset(verOffset); 
}