Dot-Net
在 WPF 中拖動圖像
我正在嘗試創建一個 WPF 應用程序,我可以在其中拖動圖像。
目前我有一個圖像放置在視窗的中心,我正在考慮使用三個滑鼠事件 MouseDown、MouseMove 和 MouseUp 來計算拖動圖像時的新位置。
關於如何做到這一點還有其他好主意嗎?我對 WPF 完全陌生,所以我的心態仍然在 Windows 窗體世界中。
據我所知,我需要使用 a 才能獲得絕對定位。
好的,這是一個附加屬性“行為”,您可以使用它來使任何元素可拖動,前提是它位於畫布上:
public class DraggableExtender : DependencyObject { // This is the dependency property we're exposing - we'll // access this as DraggableExtender.CanDrag="true"/"false" public static readonly DependencyProperty CanDragProperty = DependencyProperty.RegisterAttached("CanDrag", typeof(bool), typeof(DraggableExtender), new UIPropertyMetadata(false, OnChangeCanDragProperty)); // The expected static setter public static void SetCanDrag(UIElement element, bool o) { element.SetValue(CanDragProperty, o); } // the expected static getter public static bool GetCanDrag(UIElement element) { return (bool) element.GetValue(CanDragProperty); } // This is triggered when the CanDrag property is set. We'll // simply check the element is a UI element and that it is // within a canvas. If it is, we'll hook into the mouse events private static void OnChangeCanDragProperty(DependencyObject d, DependencyPropertyChangedEventArgs e) { UIElement element = d as UIElement; if (element == null) return; if (e.NewValue != e.OldValue) { if ((bool)e.NewValue) { element.PreviewMouseDown += element_PreviewMouseDown; element.PreviewMouseUp += element_PreviewMouseUp; element.PreviewMouseMove += element_PreviewMouseMove; } else { element.PreviewMouseDown -= element_PreviewMouseDown; element.PreviewMouseUp -= element_PreviewMouseUp; element.PreviewMouseMove -= element_PreviewMouseMove; } } } // Determine if we're presently dragging private static bool _isDragging = false; // The offset from the top, left of the item being dragged // and the original mouse down private static Point _offset; // This is triggered when the mouse button is pressed // on the element being hooked static void element_PreviewMouseDown(object sender, System.Windows.Input.MouseButtonEventArgs e) { // Ensure it's a framework element as we'll need to // get access to the visual tree FrameworkElement element = sender as FrameworkElement; if (element == null) return; // start dragging and get the offset of the mouse // relative to the element _isDragging = true; _offset = e.GetPosition(element); } // This is triggered when the mouse is moved over the element private static void element_PreviewMouseMove(object sender, MouseEventArgs e) { // If we're not dragging, don't bother - also validate the element if (!_isDragging) return; FrameworkElement element = sender as FrameworkElement; if (element == null) return; Canvas canvas = element.Parent as Canvas; if( canvas == null ) return; // Get the position of the mouse relative to the canvas Point mousePoint = e.GetPosition(canvas); // Offset the mouse position by the original offset position mousePoint.Offset(-_offset.X, -_offset.Y); // Move the element on the canvas element.SetValue(Canvas.LeftProperty, mousePoint.X); element.SetValue(Canvas.TopProperty, mousePoint.Y); } // this is triggered when the mouse is released private static void element_PreviewMouseUp(object sender, MouseButtonEventArgs e) { _isDragging = false; } }然後,您可以通過導入您的類所包含的命名空間在您的 XAML 中使用它(類似這樣:)
<Window x:Class="WPFFunWithDragging.Window1" xmlns:local="clr-namespace:WPFFunWithDragging" .. >然後您可以在要拖動的元素上設置 DraggableExtender.CanDrag=“true” :
<Canvas> <Image Source="Garden.jpg" Width="50" Canvas.Left="10" Canvas.Top="10" local:DraggableExtender.CanDrag="true"/> </Canvas>希望這有點用:)