Silverlight圖像平移

Question

我正在Silverlight應用程序上工作，我想平移圖像像上，下，左，右我如何平移圖像。

我曾使用像素着色，但我不是這個成功。

感謝..

Answer 1

看一看this sample

你也可以看看混合行爲拖動。

Answer 2

這對我有用。用戶可以使用此窗口預覽放大的圖像，並將圖像平移到更相關的部分，例如圖像的底部。

要使用窗口：

BitmapImage BMP = /* resolve the bitmap */; 

PreviewImageWindow.Execute(BMP); 

爲窗口的代碼（後面）如下所示。

using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Input; 
using System.Windows.Media.Imaging; 

namespace ITIS.Controls.LinearViewer.Windows { 

public partial class PreviewImageWindow : ChildWindow { 

    /// <summary>See Execute</summary> 
    PreviewImageWindow() { 
     InitializeComponent(); 
    } 

    private void OKButton_Click(object sender, RoutedEventArgs e) { 
     this.DialogResult = true; 
    } 

    private void CancelButton_Click(object sender, RoutedEventArgs e) { 
     this.DialogResult = false; 
    } 

    static public void Execute(BitmapImage imageSource) { 

     PreviewImageWindow Window = new PreviewImageWindow(); 

     Window.Image.Source = imageSource; 

     /* don't allow the window to grow larger than the image */ 
     Window.MaxWidth = imageSource.PixelWidth; 
     Window.MaxHeight = imageSource.PixelHeight; 

     Window.Show(); 
    } 

    private void ChildWindow_KeyDown(object sender, KeyEventArgs e) { 

     if (e.Key == Key.Escape) { 

      DialogResult = false; 
     } 
    } 

    Point? _lastPoint; 

    bool _isMouseDown; 

    private void image_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) { 

     ((Image)sender).CaptureMouse(); 

     _isMouseDown = true; 

     ShowCursor(e.GetPosition(Canvas)); 

     _lastPoint = e.GetPosition((Image)sender); 
    } 

    private void image_MouseLeftButtonUp(object sender, MouseButtonEventArgs e) { 

     ((Image)sender).ReleaseMouseCapture(); 

     _isMouseDown = false; 

     ShowCursor(e.GetPosition(Canvas)); 

     _lastPoint = null; 
    } 

    private void image_MouseMove(object sender, MouseEventArgs e) { 

     if (_lastPoint != null) { 

      Image Image = (Image)sender; 

      Point CurrentPoint = e.GetPosition(Image); 

      double 
       XDelta = CurrentPoint.X - _lastPoint.Value.X, 
       YDelta = CurrentPoint.Y - _lastPoint.Value.Y; 

      _lastPoint = null; 

      if (XDelta != 0) { 
       double NewLeft = Canvas.GetLeft(Image) + XDelta; 
       if (NewLeft <= 0 && NewLeft + Image.ActualWidth >= Canvas.ActualWidth) { 
        Canvas.SetLeft(Image, NewLeft); 
       } 
      } 

      if (YDelta != 0) { 
       double NewTop = Canvas.GetTop(Image) + YDelta; 
       if (NewTop <= 0 && NewTop + Image.ActualHeight >= Canvas.ActualHeight) { 
        Canvas.SetTop(Image, NewTop); 
       } 
      } 

      _lastPoint = e.GetPosition(Image); 
     } 

     Point CanvasPoint = e.GetPosition(Canvas); 
     ShowCursor(CanvasPoint); 
    } 

    private void Canvas_Loaded(object sender, RoutedEventArgs e) { 

     TryDefaultImageToTop(); 
    } 

    void TryDefaultImageToTop() { 

     if (Image == null || Canvas == null) { return; } 

     /* move the image up so we can focus on the road? user-friendly since we are most-likely going to look at the road, not the horizon or top - half */ 
     if (!_initialized) { 

      _initialized = true; 

      Canvas.SetTop(Image, Canvas.ActualHeight - Image.ActualHeight); 
      Canvas.SetLeft(Image, (Canvas.ActualWidth - Image.ActualWidth)/2); 
     } 
    } 

    bool _initialized; 

    private void image_Loaded(object sender, RoutedEventArgs e) { 

     TryDefaultImageToTop(); 
    } 

    private void image_MouseEnter(object sender, MouseEventArgs e) { 

     imgOpenHand.Visibility = Visibility.Visible; 
     imgClosedHand.Visibility = Visibility.Collapsed; 

     ShowCursor(e.GetPosition(Canvas)); 
    } 

    void ShowCursor(Point point) { 

     if (_isMouseDown) { 
      imgClosedHand.Visibility = Visibility.Visible; 
      imgOpenHand.Visibility = Visibility.Collapsed; 

      Canvas.SetLeft(imgClosedHand, point.X); 
      Canvas.SetTop(imgClosedHand, point.Y); 
     } 
     else { 
      imgClosedHand.Visibility = Visibility.Collapsed; 
      imgOpenHand.Visibility = Visibility.Visible; 

      Canvas.SetLeft(imgOpenHand, point.X); 
      Canvas.SetTop(imgOpenHand, point.Y); 
     } 
    } 

    private void image_MouseLeave(object sender, MouseEventArgs e) { 
     imgOpenHand.Visibility = Visibility.Collapsed; 
     imgClosedHand.Visibility = Visibility.Collapsed; 
    } 
} 

}

爲窗口的XAML如下所示：

<controls:ChildWindow 
x:Class="ITIS.Controls.LinearViewer.Windows.PreviewImageWindow" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls" 
Background="#383838" Foreground="WhiteSmoke"  
Title="Preview" Margin="50" 
HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
KeyDown="ChildWindow_KeyDown"  
> 
<Grid x:Name="LayoutRoot" Margin="0" Cursor="None" IsHitTestVisible="True"> 
    <Grid.RowDefinitions> 
     <RowDefinition /> 
     <RowDefinition Height="Auto" /> 
    </Grid.RowDefinitions> 
    <Canvas Cursor="None" IsHitTestVisible="True" x:Name="Canvas" Loaded="Canvas_Loaded"> 
     <Image Source="{Binding ImageSource}" x:Name="Image" 
       Cursor="None" Loaded="image_Loaded" 
       MouseLeftButtonDown="image_MouseLeftButtonDown" 
       MouseLeftButtonUp="image_MouseLeftButtonUp" 
       MouseMove="image_MouseMove" 
       MouseEnter="image_MouseEnter" 
       MouseLeave="image_MouseLeave" 
       IsHitTestVisible="True" 
       /> 
     <Image Style="{StaticResource HandOpenImage}" x:Name="imgOpenHand" 
       Visibility="Collapsed" IsHitTestVisible="False" 
       /> 
     <Image Style="{StaticResource HandClosedImage}" x:Name="imgClosedHand" 
       Visibility="Collapsed" IsHitTestVisible="False" 
       /> 
    </Canvas>   
</Grid>  

幾個漁獲/瞭解這個代碼註釋：

1. 的命名空間這個窗口是「ITIS.Controls.LinearVie wer.Windows「，請將命名空間更改爲系統中更相關的內容。
2. 正常光標圖像是當鼠標按鍵時，圖像的變化來
3. 的風格的圖像，我有一個全球性的應用範圍的資源字典：

（OPEN圖像樣式）

<Style TargetType="Image" x:Key="HandOpenImage"> 
    <Setter Property="Source" Value="/ITIS.Controls.LinearViewer.Silverlight;component/Images/HandOpen.png" /> 
    <Setter Property="Width" Value="16" /> 
    <Setter Property="Height" Value="16" /> 
</Style> 

（CLOSED圖像樣式）

<Style TargetType="Image" x:Key="HandClosedImage"> 
    <Setter Property="Source" Value="/ITIS.Controls.LinearViewer.Silverlight;component/Images/HandClosed.png" /> 
    <Setter Property="Width" Value="13" /> 
    <Setter Property="Height" Value="11" /> 
</Style> 

1. 此預覽嘗試着重於圖像的下半部分而不是上半部分。

希望這會有所幫助。我耗費了一些時間來消除一些煩惱。