wpf中可排序的WrapPanel

本文关键字：WrapPanel 排序 wpf | 更新日期: 2023-09-27 18:12:29

我需要在wpf中实现此功能。当你去到那个链接时，注意你如何拖动对象并把它们放在不同的位置。我想知道是否有可能用wpf创建这个。我已经知道如何拖动对象了。这里有一个很好的答案，解释了如何做到这一点。我需要这些对象对齐。使用最后一个链接只允许我拖动对象，但我需要在拖动完成后使它们对齐。

wpf中可排序的WrapPanel

有很多不同的方法可以做到这一点，但这里有几个想法:

  1. 一个自定义面板，附加属性为XOffset, YOffset和issnaps(默认为true)。当用户拖动一个项目时，将issnaps设置为false，并在拖动时更新XOffset/YOffset。面板的布局逻辑可以安排强对齐的项目(基于他们的XOffset/YOffset)，除非issnaps为假，在这种情况下，他们只是出现在(XOffset, YOffset)。
  2. 使用现有的拖动行为，比如blend提供的拖动行为，但在子项目被放下后，将自己的坐标强加给子项目。UPDATE:这将不起作用，或者会很混乱，因为Blend修改了拖动元素的RenderTransform，而不是更新一些附加的属性，你可以根据你的计算。
  3. 主要在视图模型中使用MVVM。也就是说，在视图模型上拥有Top, Left, Width和Height的属性，所有这些属性都通过行为(DragBehavior和SizeObserver行为)进行更新。让父视图模型公开子视图模型(每个子视图模型代表一个可拖动项)。让父虚拟机监控子坐标的变化，并在必要时强制执行。

我现在也在做类似的事情，我选择了#3。还没有后悔，而且它比你在这里试图实现的要复杂得多，所以你不应该有任何阻碍。

UPDATE:这是我的拖放行为:

using System.Diagnostics;
using System.Windows;
using System.Windows.Input;
using System.Windows.Media;
using Kent.Boogaart.HelperTrinity.Extensions;
public static class DragDrop
{
    public static readonly RoutedEvent PreviewBeginDragEvent = EventManager.RegisterRoutedEvent(
        "PreviewBeginDrag",
        RoutingStrategy.Tunnel,
        typeof(RoutedEventHandler),
        typeof(DragDrop));
    public static readonly RoutedEvent BeginDragEvent = EventManager.RegisterRoutedEvent(
        "BeginDrag",
        RoutingStrategy.Bubble,
        typeof(RoutedEventHandler),
        typeof(DragDrop));
    public static readonly RoutedEvent PreviewDragEvent = EventManager.RegisterRoutedEvent(
        "PreviewDrag",
        RoutingStrategy.Tunnel,
        typeof(RoutedEventHandler),
        typeof(DragDrop));
    public static readonly RoutedEvent DragEvent = EventManager.RegisterRoutedEvent(
        "Drag",
        RoutingStrategy.Bubble,
        typeof(RoutedEventHandler),
        typeof(DragDrop));
    public static readonly RoutedEvent PreviewEndDragEvent = EventManager.RegisterRoutedEvent(
        "PreviewEndDrag",
        RoutingStrategy.Tunnel,
        typeof(RoutedEventHandler),
        typeof(DragDrop));
    public static readonly RoutedEvent EndDragEvent = EventManager.RegisterRoutedEvent(
        "EndDrag",
        RoutingStrategy.Bubble,
        typeof(RoutedEventHandler),
        typeof(DragDrop));
    public static readonly DependencyProperty CanDragProperty = DependencyProperty.RegisterAttached(
        "CanDrag",
        typeof(bool),
        typeof(DragDrop),
        new FrameworkPropertyMetadata(OnCanDragChanged));
    public static readonly DependencyProperty IsDragInProgressProperty;
    public static readonly DependencyProperty DragParentProperty = DependencyProperty.RegisterAttached(
        "DragParent",
        typeof(FrameworkElement),
        typeof(DragDrop));
    public static readonly DependencyProperty XOffsetProperty = DependencyProperty.RegisterAttached(
        "XOffset",
        typeof(double),
        typeof(DragDrop));
    public static readonly DependencyProperty YOffsetProperty = DependencyProperty.RegisterAttached(
        "YOffset",
        typeof(double),
        typeof(DragDrop));
    private static readonly DependencyPropertyKey isDragInProgressPropertyKey = DependencyProperty.RegisterAttachedReadOnly(
        "IsDragInProgress",
        typeof(bool),
        typeof(DragDrop),
        new FrameworkPropertyMetadata(false, FrameworkPropertyMetadataOptions.Inherits));
    private static readonly DependencyProperty DragPointProperty = DependencyProperty.RegisterAttached(
        "DragPoint",
        typeof(Point?),
        typeof(DragDrop),
        new PropertyMetadata());
    static DragDrop()
    {
        IsDragInProgressProperty = isDragInProgressPropertyKey.DependencyProperty;
    }
    public static void AddPreviewBeginDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.AddHandler(PreviewBeginDragEvent, handler);
        }
    }
    public static void RemovePreviewBeginDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.RemoveHandler(PreviewBeginDragEvent, handler);
        }
    }
    public static void AddBeginDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.AddHandler(BeginDragEvent, handler);
        }
    }
    public static void RemoveBeginDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.RemoveHandler(BeginDragEvent, handler);
        }
    }
    public static void AddPreviewDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.AddHandler(PreviewDragEvent, handler);
        }
    }
    public static void RemovePreviewDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.RemoveHandler(PreviewDragEvent, handler);
        }
    }
    public static void AddDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.AddHandler(DragEvent, handler);
        }
    }
    public static void RemoveDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.RemoveHandler(DragEvent, handler);
        }
    }
    public static void AddPreviewEndDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.AddHandler(PreviewEndDragEvent, handler);
        }
    }
    public static void RemovePreviewEndDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.RemoveHandler(PreviewEndDragEvent, handler);
        }
    }
    public static void AddEndDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.AddHandler(EndDragEvent, handler);
        }
    }
    public static void RemoveEndDragHandler(DependencyObject dependencyObject, RoutedEventHandler handler)
    {
        var inputElement = dependencyObject as IInputElement;
        if (inputElement != null)
        {
            inputElement.RemoveHandler(EndDragEvent, handler);
        }
    }
    public static bool GetCanDrag(FrameworkElement frameworkElement)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        return (bool)frameworkElement.GetValue(CanDragProperty);
    }
    public static void SetCanDrag(FrameworkElement frameworkElement, bool canDrag)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        frameworkElement.SetValue(CanDragProperty, canDrag);
    }
    public static FrameworkElement GetDragParent(DependencyObject dependencyObject)
    {
        dependencyObject.AssertNotNull("dependencyObject");
        return dependencyObject.GetValue(DragParentProperty) as FrameworkElement;
    }
    public static void SetDragParent(DependencyObject dependencyObject, FrameworkElement dragParent)
    {
        dependencyObject.AssertNotNull("dependencyObject");
        dependencyObject.SetValue(DragParentProperty, dragParent);
    }
    public static double GetXOffset(FrameworkElement frameworkElement)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        return (double)frameworkElement.GetValue(XOffsetProperty);
    }
    public static void SetXOffset(FrameworkElement frameworkElement, double xOffset)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        frameworkElement.SetValue(XOffsetProperty, xOffset);
    }
    public static double GetYOffset(FrameworkElement frameworkElement)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        return (double)frameworkElement.GetValue(YOffsetProperty);
    }
    public static void SetYOffset(FrameworkElement frameworkElement, double yOffset)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        frameworkElement.SetValue(YOffsetProperty, yOffset);
    }
    public static bool GetIsDragInProgress(DependencyObject dependencyObject)
    {
        dependencyObject.AssertNotNull("dependencyObject");
        return (bool)dependencyObject.GetValue(IsDragInProgressProperty);
    }
    private static void SetIsDragInProgress(DependencyObject dependencyObject, bool isDragInProgress)
    {
        dependencyObject.AssertNotNull("dependencyObject");
        dependencyObject.SetValue(isDragInProgressPropertyKey, isDragInProgress);
    }
    private static Point? GetDragPoint(FrameworkElement frameworkElement)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        return (Point?)frameworkElement.GetValue(DragPointProperty);
    }
    private static void SetDragPoint(FrameworkElement frameworkElement, Point? dragPoint)
    {
        frameworkElement.AssertNotNull("frameworkElement");
        frameworkElement.SetValue(DragPointProperty, dragPoint);
    }
    private static void OnCanDragChanged(DependencyObject dependencyObject, DependencyPropertyChangedEventArgs e)
    {
        var frameworkElement = (FrameworkElement)dependencyObject;
        if ((bool)e.NewValue)
        {
            frameworkElement.MouseLeftButtonDown += OnFrameworkElementMouseLeftButtonDown;
            frameworkElement.MouseMove += OnFrameworkElementMouseMove;
            frameworkElement.MouseLeftButtonUp += OnFrameworkElementMouseLeftButtonUp;
            var parent = GetDragParent<FrameworkElement>(frameworkElement);
            if (parent == null)
            {
                frameworkElement.SetCurrentValue(XOffsetProperty, 0d);
                frameworkElement.SetCurrentValue(YOffsetProperty, 0d);
            }
            else
            {
                var pointRelativeToParent = frameworkElement.TranslatePoint(new Point(0, 0), parent);
                frameworkElement.SetCurrentValue(XOffsetProperty, pointRelativeToParent.X);
                frameworkElement.SetCurrentValue(YOffsetProperty, pointRelativeToParent.Y);
            }
        }
        else
        {
            frameworkElement.MouseLeftButtonDown -= OnFrameworkElementMouseLeftButtonDown;
            frameworkElement.MouseMove -= OnFrameworkElementMouseMove;
            frameworkElement.MouseLeftButtonUp -= OnFrameworkElementMouseLeftButtonUp;
        }
    }
    private static void OnFrameworkElementMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        var frameworkElement = (FrameworkElement)sender;
        var parent = GetDragParent<FrameworkElement>(frameworkElement);
        if (parent == null)
        {
            return;
        }
        var previewBeginDragEventArgs = new RoutedEventArgs(PreviewBeginDragEvent);
        frameworkElement.RaiseEvent(previewBeginDragEventArgs);
        if (previewBeginDragEventArgs.Handled)
        {
            return;
        }
        SetIsDragInProgress(frameworkElement, true);
        SetDragPoint(frameworkElement, e.GetPosition(parent));
        frameworkElement.CaptureMouse();
        frameworkElement.RaiseEvent(new RoutedEventArgs(BeginDragEvent));
    }
    private static void OnFrameworkElementMouseMove(object sender, MouseEventArgs e)
    {
        var frameworkElement = (FrameworkElement)sender;
        if (frameworkElement.IsMouseCaptured)
        {
            var previewDragEventArgs = new RoutedEventArgs(PreviewDragEvent);
            frameworkElement.RaiseEvent(previewDragEventArgs);
            if (previewDragEventArgs.Handled)
            {
                return;
            }
            var parent = GetDragParent<FrameworkElement>(frameworkElement);
            if (parent == null)
            {
                return;
            }
            var currentPointRelativeToParent = e.GetPosition(parent);
            var dragPoint = GetDragPoint(frameworkElement);
            Debug.Assert(dragPoint.HasValue, "dragPoint should be set.");
            frameworkElement.SetCurrentValue(XOffsetProperty, GetXOffset(frameworkElement) + (currentPointRelativeToParent.X - dragPoint.Value.X));
            frameworkElement.SetCurrentValue(YOffsetProperty, GetYOffset(frameworkElement) + (currentPointRelativeToParent.Y - dragPoint.Value.Y));
            SetDragPoint(frameworkElement, currentPointRelativeToParent);
            frameworkElement.RaiseEvent(new RoutedEventArgs(DragEvent));
        }
    }
    private static void OnFrameworkElementMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
    {
        var frameworkElement = (FrameworkElement)sender;
        if (frameworkElement.IsMouseCaptured)
        {
            frameworkElement.RaiseEvent(new RoutedEventArgs(PreviewEndDragEvent));
            SetDragPoint(frameworkElement, null);
            frameworkElement.ReleaseMouseCapture();
            frameworkElement.RaiseEvent(new RoutedEventArgs(EndDragEvent));
            SetIsDragInProgress(frameworkElement, false);
        }
    }
    private static T GetDragParent<T>(DependencyObject dependencyObject)
        where T : DependencyObject
    {
        var dragParent = GetDragParent(dependencyObject) as T;
        if (dragParent != null)
        {
            return dragParent;
        }
        var parent = VisualTreeHelper.GetParent(dependencyObject);
        while (parent != null && !(parent is T))
        {
            parent = VisualTreeHelper.GetParent(parent);
        }
        return (T)parent;
    }
}

如果你想要动态发生，那么我相信最好的解决方案是创建一个从WrapPanel派生的UniformWrapPanel，然后覆盖MeasureOverride和ArrangeOverride方法。然后在MeasureOverride方法中注意到最大项目所需宽度(用于水平对齐)，然后在ArrangeOverride方法中，对于翘曲排列过程中的每一行，让每个项目在一个矩形中排列自己，该矩形总是被最大项目所需宽度移动。

如果你知道项目的大小，那么我相信它将通过设置WrapPanel上的ItemWidth和ItemHeight属性来工作。例如:

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid>  
    <WrapPanel ItemWidth="150">
      <Rectangle Width="50" Height="50" Fill="Red" Margin="10" />
      <Rectangle Width="150" Height="50" Fill="Red" Margin="10" />
      <Rectangle Width="20" Height="50" Fill="Red" Margin="10" />
      <Rectangle Width="50" Height="50" Fill="Red" Margin="10" />
    </WrapPanel>
  </Grid>
</Page>

一个hack的解决方案可能是从WrapPanel中派生，重写ArrangeOverride方法，迭代所有子元素并找到最大的大小，设置ItemWidth和ItemHeight属性，然后调用base。安排override完成其余的工作。

相关文章：