搜索区域矩形图像叠加 [英] Search Area rectangle Image Overlay

问题描述

大家好

我有一个显示图像的图像查看器.我想使用鼠标在图像上绘制一个矩形，并获取矩形(X1，X2，Y1和Y2)的x和y坐标.我将使用这些坐标来创建搜索区域，并在数组中找到两个像素中像素数均与图像相同的最大值和最小值.
有人可以指导我开始入门吗?

Hello All

I have an Image viewer that displays an image. I want to draw a rectangle using the mouse over the image and get the x and y coordinates of the rectangle (X1, X2, Y1, and Y2). I will use these coordinates to create a search region and find the max and min values in an array that have the exact number of pixels as the image in both axes.
Can anyone guide me to a direction to start please?

推荐答案

我将此问题报告为不清楚或不完整"，并问您:那么，问题出在哪里? ?就做吧.

问题中有一个细节让我觉得这对您而言并不那么容易:覆盖.可能您有使用DirectX的经验，这就是为什么您认为这很困难的原因.也许您试图将GDI渲染与DirectX结合起来，这确实非常困难. WPF不支持，WPF是基于DirectX的，与GDI无关.一切都透明地实现；换句话说，对于您作为WPF开发人员而言，没有覆盖".您可以在任何物体上放置任何形状:位图甚至视频剪辑，所有零件都将正确呈现.

您只需要使用类System.Windows.Shapes.Rectangle， http://msdn.microsoft .com/en-us/library/system.windows.shapes.rectangle.aspx [ http://msdn.microsoft.com/en-us/library/system.windows.controls.canvas.aspx [ http://msdn.microsoft.com/en-us/library/ms742556.aspx [ ^ ].

自然，您将需要处理鼠标/键盘事件，以在运行时控制矩形的位置和大小.

—SA

I reported this question as "Unclear or Incomplete" and asked you: so, what''s the problem? Just do it.

There is one detail in the question that makes me think this is not so easy for you: overlay. Probably, you had some experience working with DirectX, that''s why you think this is difficult. Maybe you tried to combine GDI rendering with DirectX, which is really pretty difficult. Not with WPF, which is based on DirectX and has nothing to do with GDI. Everything is implemented transparently; in other words, for you as a WPF developers there are no "overlays". You can place any shape on top of anything: bitmap, even video clip, and all parts will be rendered correctly.

All you need is using the class System.Windows.Shapes.Rectangle, http://msdn.microsoft.com/en-us/library/system.windows.shapes.rectangle.aspx[^].

Alternatively, you can put both image and rectangle on the System.Windows.Controls.Canvas (http://msdn.microsoft.com/en-us/library/system.windows.controls.canvas.aspx[^]), which makes it easy to manipulate shape and image coordinates using attached properties Top, Left… During run time, this is done by the calls to Canvas.SetLeft(element, left), Canvas.SetTop(element, top), http://msdn.microsoft.com/en-us/library/ms742556.aspx[^].

Naturally, you will need to handle mouse/keyboard events to manipulate position and size of the rectangle during run time.

—SA

感谢指针和帮助:
这是我完成的代码，可以正常工作.您可以将鼠标放在画布上的任何位置，并按住鼠标并拖动以创建矩形.它可以使用更多的改进来向任意方向拖动和创建矩形.

XAML:

Thanks for the pointers and help:
Here is my finished code and it works. You place the mouse anywhere on the canvas hold mouse down and drag to create the rectangle. It could use some more improvement to drag and create the rectangle in any direction.

XAML:

<Canvas Name="ImageCanvas"

           MouseMove="ImageCanvas_MouseMove"

               MouseDown="ImageCanvas_MouseDown"

           Height="240" Width="320"

           HorizontalAlignment="Left"

           Margin="87,514,0,0"  VerticalAlignment="Top" MouseLeftButtonUp="ImageCanvas_MouseLeftButtonUp">
           <Canvas.Background>
           <ImageBrush x:Name="Image" Stretch="Uniform" ImageSource="C:\image.bmp">
           </ImageBrush>
           </Canvas.Background>
           <Rectangle x:Name="ROI" Stroke="#FFF1133E"  Width="20" Height="20" Canvas.Left="155" Canvas.Top="115" />

       </Canvas>

代码:

Code:

double topLeftX = 0;
double topLeftY = 0;
double bottomRightX = 0;
double bottomrigthY = 0;
bool setRect = false;

private void ImageCanvas_MouseDown(object sender, MouseButtonEventArgs e)
{
    topLeftY = topLeftX = bottomrigthY = bottomRightX = 0;
    setRect = true;
    System.Windows.Point pt = e.MouseDevice.GetPosition(sender as Canvas);
    topLeftX = pt.X; topLeftY = pt.Y;
}

private void ImageCanvas_MouseMove(object sender, System.Windows.Input.MouseEventArgs e)
{
    if (setRect == true)
    {
        //get mouse location relative to the canvas
        System.Windows.Point pt = e.MouseDevice.GetPosition(sender as Canvas);
        Canvas.SetLeft(ROI, topLeftX);
        Canvas.SetTop(ROI, topLeftY);
        ROI.Width = System.Math.Abs((int)(pt.X - topLeftX));
        ROI.Height = System.Math.Abs((int)(pt.Y - topLeftY));
        commandReturnTB.Text = (Convert.ToString(pt.X) + "," + Convert.ToString(pt.Y))+"\n";  
    }
}

private void ImageCanvas_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    System.Windows.Point pt = e.MouseDevice.GetPosition(sender as Canvas);
    bottomRightX = pt.X;
    bottomrigthY = pt.Y;
    ROI.Width = System.Math.Abs((int)(bottomRightX - topLeftX));
    ROI.Height = System.Math.Abs((int)(bottomrigthY - topLeftY));
    Canvas.SetLeft(ROI, topLeftX);
    Canvas.SetTop(ROI, topLeftY);
    setRect = false;
    commandReturnTB.Text = topLeftX + "," + topLeftY + "--" + bottomRightX + "," + bottomrigthY;
}

这篇关于搜索区域矩形图像叠加的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！