8

我有一个面板，该面板中有几个矩形控件（控件的数量）我希望用户能够在面板内移动控件，以便他们可以以最适合他们的方式排列控件。有没有人有任何我可以阅读的资源或简单的提示可以让我走上正确的道路？

谢谢

4

2 回答 2

10

我想出了一种以拖动/移动方式移动控件的可能的简单方法......以下是步骤。

  1. 在您的控件中选择一个您希望作为移动区域的元素。这是一个区域，如果我的用户按住鼠标，控件将移动。在我的情况下，它是控件顶部的矩形边框。
  2. 使用 OnMouseDown 事件将布尔值（在我的情况下为 IsMoving）设置为 true，并使用 MouseUp 事件将其设置为 false

  3. 在第一个 MouseDown 事件中，使用以下代码设置一些 Point 属性 (InitialPosition) 

    if (FirstClick)
{
     GeneralTransform transform = this.TransformToAncestor(this.Parent as Visual);
     Point StartPoint = transform.Transform(new Point(0, 0));
     StartX = StartPoint.X;
     StartY = StartPoint.Y;
     FirstClick = false;
}

  4. 现在您有了起始位置，您需要获取鼠标相对于您的移动控件的位置。这样您就不会最终单击标题的中间来移动它，它会立即将控件的左上角移动到鼠标指针位置。为此，请将此代码放在 MouseDown 事件中： 

    Point RelativeMousePoint = Mouse.GetPosition(Header);
RelativeX = RelativeMousePoint.X;
RelativeY = RelativeMousePoint.Y;

  5. 现在您有了控件的起始点（startX 和 STARTY），鼠标在您的移动控件中的位置（RelativeX，RelativeY），我们只需要将控件移动到新位置！执行此操作涉及几个步骤。首先，您的控件需要有一个 RenderTransform，它是一个 TranslateTransform。如果您不想在 XAML 中设置它，请随意使用this.RenderTransform = new TranslateTransform.

  6. 现在我们需要在 RenderTransform 上设置 X 和 Y 坐标，以便控件移动到新位置。下面的代码完成了这个

    private void Header_MouseMove(object sender, MouseEventArgs e)
{
    if (IsMoving)
    {
        //Get the position of the mouse relative to the controls parent              
        Point MousePoint = Mouse.GetPosition(this.Parent as IInputElement );
        //set the distance from the original position
        this.DistanceFromStartX= MousePoint.X - StartX - RelativeX ;
        this.DistanceFromStartY= MousePoint.Y - StartY - RelativeY;
        //Set the X and Y coordinates of the RenderTransform to be the Distance from original position. This will move the control
        TranslateTransform MoveTransform = base.RenderTransform as TranslateTransform;
        MoveTransform.X = this.DistanceFromStartX;
        MoveTransform.Y = this.DistanceFromStartY;
    }
}

你可以猜到，有一些代码被遗漏了（变量声明等），但这应该是你开始所需要的一切:) 快乐的编码。

编辑：
您可能遇到的一个问题是，这允许您将控件移出其父控件的区域。这是一些快速而肮脏的代码来解决该问题...

if ((MousePoint.X + this.Width - RelativeX > Parent.ActualWidth) ||
     MousePoint.Y + this.Height - RelativeY > Parent.ActualHeight ||
     MousePoint.X - RelativeX  < 0 || 
     MousePoint.Y - RelativeY  < 0)
{
    IsMoving = false;
    return;
}

在实际移动发生之前将此代码放在 MouseMove 事件中。这将检查控件是否试图移出父控件的边界。该IsMoving = false命令将导致控制器退出移动模式。这意味着用户将需要再次单击移动区域以尝试移动控件，因为它将在边界处停止。如果您希望控件自动继续移动，只需将该行移出，控件将在回到合法区域后立即跳回光标。

于 2010-05-14T02:54:18.033 回答