在WPF中在运行时调整Rectangle的大小 [英] Resize the Rectangle at runtime in WPF

问题描述

你好，

谁能给我一个示例，说明如何通过拖动鼠标来调整矩形大小和旋转矩形.

通过鼠标事件，iam可以在运行时在画布上绘制矩形，
现在，我想将矩形调整为所需的大小，并能够在运行时用鼠标旋转矩形.

C#代码:

Hello,

can any one give me an example how to resize and rotate the rectangle with mouse by dragging.

With the mouse events iam able to draw a rectangle on the canvas during runtime,
Now i want to resize the rectangle to desired size and able to rotate the rectangle with mouse at runtime.

C# code:

private Point startPoint;        
private Rectangle rect;

在MouseLeftbuttondown下:

under MouseLeftbuttondown:

startPoint = e.GetPosition(Canvas1);
                rect = new Rectangle
                {
                    Stroke = Brushes.Blue,
                    StrokeThickness = 1

                };

                Canvas.SetLeft(rect,startPoint.X);
                Canvas.SetTop(rect,startPoint.X);

                Canvas1.Children.Add(rect);

鼠标移动:

Mouse MOve:

if(e.LeftButton == MouseButtonState.Released || rect == null)
                    return;

                var pos = e.GetPosition(Canvas1);

                var x = Math.Min(pos.X, startPoint.X);
                var y = Math.Min(pos.Y, startPoint.Y);

                var w = Math.Max(pos.X, startPoint.X) - x;
                var h = Math.Max(pos.Y, startPoint.Y) - y;

                rect.Width = w;
                rect.Height = h;

                Canvas.SetLeft(rect, x);
                Canvas.SetTop(rect, y);

鼠标左键向上:

MouseLeftbutton up:

rect = null;

使用此代码，我可以绘制一个矩形，如何从后面的代码中用鼠标调整矩形的大小和旋转矩形.

非常感谢任何帮助.

Using this code i can draw a rectangle, How can i resize and rotate the rectangle with the mouse from code behind.

any help is much appreciated.

推荐答案

您首先需要确定自己的交互方法.

1.是否要在矩形内开始拖动操作以执行调整大小?
2.是否要仅在拖动操作在矩形边缘(或在该边缘的n个像素内)开始拖动时才发生调整大小，如果将尺寸调整限制在该边缘定义的尺寸(即，拖动右边缘仅允许宽度)调整大小)?
3.当您将鼠标悬停在矩形上方并使用它们来执行调整大小时，是否要显示抓握柄"装饰物?

对于1:

与上面的代码类似，将处理程序添加到鼠标的矩形的下移，上移和上移事件中，以调整高度/宽度.确保在矩形上调用Mouse.Capture和Mouse.Release(这可确保鼠标移动事件继续击中矩形，即使您移动光标的速度足够快，以至于在调整矩形大小之前它离开矩形边界，也会发生这种情况使用WPF可以轻松实现..通过布局调整不是很迅速)

对于2:

您可以使用边界为它们自己的实体的复合形状替换矩形，从而可以不同地处理鼠标事件，也可以在矩形鼠标事件中执行一些时髦的逻辑，以确定点击位置是否在边缘的n像素以内，然后按照选项1进行操作

对于3:

查看Adorner类，WPF附带了Adorner层功能.本质上，这提供了一种方法，可以使UI元素被覆盖层中的其他UI元素修饰"，并且是获取处理程序和上下文UI的通用方法.

希望对您有帮助

You first need to decide on your interaction method.

1. Do you want a drag operation starting within the rectangle to perform the resize?
2. Do you want the resize to only occur if the drag operation starts on the rectangles edge (or within n pixels of that edge), should the resizing be constrained to the dimension defined by the edge(i.e. dragging the right edge only allows width resize)?
3. Do you want ''grab handle'' adorners to appear when you hover the mouse over the rectangle and have these be used to perform the resize?

For 1:

Add a handler to the mouse down, move and up events of the rectangle that adjust the height/width similar to your above code. Make sure to call Mouse.Capture and Mouse.Release on your rectangle (this ensures the mouse move event continues to hit the rectangle even if you move the cursor fast enough that it leaves the rectangle bounds before the rectangle can be resized, this can happen easily with WPF.. its not very speedy with the layout adjustments)

For 2:

You can either replace the rectangle with a composite shape where the borders are their own entity and can therefore handle mouse events differently or you can do some funky logic in the rectangle mouse events to determine if the click location is within n pixels of an edge, then do as in option 1

For 3:

Look into the Adorner class, WPF comes with Adorner layer functionality. This, essentially, provides a means by which UI elements can be ''decorated'' by other UI elements in an overlay layer and is the general approach to grab handlers and contextual UI

hope that helps

这篇关于在WPF中在运行时调整Rectangle的大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！