根据鼠标位置缩小到窗口中



hi im目前在C 中编写Win32应用程序,我确实有一个问题,可以将缩放到窗口的内容中。这是我开始完成缩放的伪代码:

// point One
int XPointOne = -200;
int YPointTwo = 0;
// point Two
int XPointTwo = 200;
int YPointTwo = 0;
// Draw point function.
DrawPoint(XCoordinate * ScalingFactor, YCoordinate * ScalingFactor) {
    ....
}

我的坐标系设置为将其起源在窗口的中心。我想在使用鼠标轮时缩放。上面解决方案的问题在于,缩放始终是从窗口中心发生的。当您的鼠标不在窗户的中心时,这种有点丑陋。我想放大鼠标所在的区域,但找不到合适的算法来缩放X和Y方向的偏移。例如,如果鼠标具有坐标(-200,0)点,则应应具有坐标(-200,0),并指向两个坐标(600,0),缩放系数为两个。我已经尝试了很多事情,但没有使它起作用,尤其是当鼠标移动到缩小一切都弄乱之间的其他位置时。有人知道如何解决这个问题吗?

这是我的应用程序的一些示例代码。第一个片段是我用于处理WM_Mousewheel消息的回调功能。

VOID OnMouseWheel(WPARAM const& WParam, LPARAM const& LParam) {
    if(GET_WHEEL_DELTA_WPARAM(WParam) > 0)
    {
        // Zoom in
        Draw.ScaleFactor += 0.1;
    }
    else
    {
         // Zoom out
    }
}

绘制只是包裹GDI功能的类。它具有缩放因子成员。下面的摘要是使用比例因子在屏幕上正确显示圆的drawcircle构件函数。

VOID DrawCircle(DOUBLE const& XCoordinate, DOUBLE const& YCoordinate, DOUBLE const& Radius, COLORREF const& Color) {
    HBRUSH Brush = CreateSolidBrush(Color);
    HBRUSH OldBrush = (HBRUSH)SelectObject(this->MemoryDC, Brush);
    Ellipse(this->MemoryDC, (INT) ((XCoordinate - Radius) * this->ScaleFactor), 
        -(INT)((YCoordinate + Radius) * this->ScaleFactor), 
         (INT)((XCoordinate + Radius) * this->ScaleFactor), 
        -(INT)((YCoordinate - Radius) * this->ScaleFactor)); 
    SelectObject(this->MemoryDC, OldBrush);
    DeleteObject(Brush);
 }

您可以看到我的drawcircle函数在应用当前比例因子时不会考虑鼠标位置。

编辑

好吧,我更接近解决方案,这是我的鼠标回调函数的更新版本。

VOID OnMouseWheel(WPARAM const& WParam, LPARAM const& LParam) {
    // Get Mouse position in real coordinates and not window coordinates.
    INT XOffset = (Window.GetClientWidth() / -2) + XMousePos;
    INT YOffset = (Window.GetClientHeight() / 2) - YMousePos;

    if(GET_WHEEL_DELTA_WPARAM(WParam) > 0)
    {
        Draw.ScaleFactor += 0.1;
        Draw.XOffsetScale = -XOffset * (Draw.ScaleFactor - 1.0);
        Draw.YOffsetScale = YOffset * (Draw.ScaleFactor - 1.0);
    }
    else
    {
        // ...
    }
}

这是绘制圆圈的函数。

VOID DrawCircle(DOUBLE const& XCoordinate, DOUBLE const& YCoordinate, DOUBLE const& Radius, COLORREF const& Color) {
        HBRUSH Brush = CreateSolidBrush(Color);
        HBRUSH OldBrush = (HBRUSH)SelectObject(this->MemoryDC, Brush);
        Ellipse(this->MemoryDC, (INT) ((XCoordinate - Radius) * this->ScaleFactor + XOffsetScale) , 
            -(INT)((YCoordinate + Radius) * this->ScaleFactor - YOffsetScale), 
            (INT)((XCoordinate + Radius) * this->ScaleFactor + XOffsetScale), 
            -(INT)((YCoordinate - Radius) * this->ScaleFactor - YOffsetScale)); 
        SelectObject(this->MemoryDC, OldBrush);
        DeleteObject(Brush);
 }

这确实可以工作,只要我将鼠标保持在相同的位置,但是当我移动到另一个位置时,它不会像预期的那样缩小,然后再正确缩放。也许这有点有帮助。

预先感谢!

已解决

好,我现在解决了问题。我只是根据鼠标位置乘以缩放系数的鼠标位置移动了坐标系的原点。感谢您的答案。

最``通用''解决方案使用矩阵变换,但这是简化的解释。以下伪代码可能会帮助您:

/*
    VARIABLES (all in space coordinates, not pixel coordinates):
      input:
        viewRect = rectangle of the viewed area
        zoomFactor = factor of zoom relative to viewRect, ex 1.1
        mousePos = position of the mouse
      output:
        zoomedRect = viexRect after zoom
*/
/*
    A little schema:
      viewRect
    *-----------------------------------------------------------------------*
    |                       ^                                               |
    |                       | d_up                                          |
    |        zoomedRect     v                                               |
    |      *-----------------------------------------*                      |
    |d_left|                                         |       d_right        |
    |<---->|                mousePos                 |<-------------------->|
    |      |                    +                    |                      |
    |      |                                         |                      |
    |      |                                         |                      |
    |      *-----------------------------------------*                      |
    |                       ^                                               |
    |                       |                                               |
    |                       |                                               |
    |                       | d_down                                        |
    |                       |                                               |
    |                       v                                               |
    *-----------------------------------------------------------------------*
    dX = d_left + d_right
    dY = d_up + d_down
    The origin of rects is the upper left corner.
*/
/*
    First, find differences of size between zoomed rect and original rect
    Here, 1 / zoomFactor is used, because computations are made relative to the
    original view area, not the final rect):
*/
dX = viewRect.width * (1 - 1 / zoomFactor)
dY = viewRect.height * (1 - 1 / zoomFactor)
/*
    Second, find d_* using the position of the mouse.
    pX = position of the mouse along X axis, relative to viewRect (percentage)
    pY = position of the mouse along Y axis, relative to viewRect (percentage)
    The value of d_right and d_down is not computed because is not directly needed
    in the final result.
*/
pX = (mousePos.X - viewRect.X) / viewRect.width
pY = (mousePos.Y - viewRect.Y) / viewRect.height
d_left = pX * dX
d_up = pY * dY
/*
    Third and last, compute the output rect
*/
zoomedRect = viewRect
zoomedRect.X += d_left
zoomedRect.Y += d_up
zoomedRect.width -= dX
zoomedRect.height -= dY
// That's it!

为了解决问题,您需要将视图(窗口)与场景(绘制的对象)分开。您应该有一个函数绘制场景的一部分(或全部):

void drawScene(Rect viewArea);

和一个函数缩小区域(使用之前介绍的算法):

Rect zoomArea(Rect rectToZoom, Point zoomCenter, double factor);

现在,您的回调要简单得多:

VOID OnMouseWheel(WPARAM const& WParam, LPARAM const& LParam)
{
    // Get the position of the mouse relative to the window (in percent)
    double XMouseRel = XMousePos / double(Window.GetClientWidth());
    double YMouseRel = YMousePos / double(Window.GetClientHeight());
    // Get Mouse position in scene coordinates and not window coordinates.
    // viewArea is in scene coordinates
    // window = your window or your draw information on the scene
    // The following assumes that you're using a scene with X left-to-right and
    // Y top-to-bottom.
    double XMouse = window.viewArea.width * XMouseRel + window.viewArea.upperleft.X;
    double YMouse = window.viewArea.height * YMouseRel + window.viewArea.upperleft.Y;
    // Zoom parameters
    double zFactor = 0.1 * GET_WHEEL_DELTA_WPARAM(WParam);
    Rect viewArea = getViewArea(); // or something like this
    Point zCenter(XMouse,YMouse);
    // Zoom
    Rect zoomedRect = zoomArea(viewArea,zCenter,zFactor);
    drawScene(zoomedRect);
}

您正在尝试在平面中实现仿射转换的子集。在您的情况下,您只需要结合绘图平面的翻译和缩放(缩放)即可。飞机上仿射转换的全套可能性涉及使用3个维度的矩阵,但是现在,我只为您的问题提供必要的最低限度。随时查找网上的完整主题,有关此的文献很多。

首先,我们将声明一个2D向量和一些操作员:

  class vector2D {
  protected:
      /* here your class implementation details */
  public:
      vector2D(const vector2D &v);
      vector2D(float x, float y) { /* ... */ }
      vector2D operator +(const vector2D &v) const { /* ... */ }
      vector2D operator -(const vector2D &v) const { /* ... */ }
      vector2D operator *(float v) const { /* ... */ }
      bool operator ==(const vector2D &v) const { /* ... */ }
      const vector2D &operator = (const vector2D &v) { /* ... */ }
  };

我会让您填写空白,或者如果有的话,我会使用自己的班级。请注意,此界面可能不是最佳的,但我想专注于算法,而不是性能。

现在,让我们介绍显示转换:

我们将zf称为缩放因子,trans转换的转换部分,而origin原点是窗口中的视图。您提到您的协调系统以窗口为中心,因此原点是窗口屏幕的中心。可以在两个单独的阶段分解从视图系统到窗口坐标的转换:一个将是显示对象的缩放和翻译,我们将称为 modelview ,一个将是从视图坐标到窗口坐标的翻译,我们将称为投影。如果您熟悉3D渲染,则可以将其视为与OpenGl中使用的机制相似的机制。

投影可以描述为从窗口左上到视图的origin的简单翻译。

  vector2D project(const vector2D &v){
      return v + origin;
  }

modelView 结合了翻译和缩放(此时,UI代码仅处理任意点的缩放)。

  vector2D modelview(const vector2D &v){
      return trans + (v * zf);
  }

我会让您组织这些功能和相关数据(zfcentretrans)最方便的方法。

接下来,让我们看看如何通过UI修改不同的数据。

基本上,您需要将点坐标从位于视图中心的坐标系更改为以缩放点为中心的系统,然后进行新的坐标缩放,然后返回视图中心。您希望绘制的每个对象都必须经历此转换。

那么公式是:

v'=(v zp) * s -zp

其中 zp 是缩放点, s 是缩放因子, v 是系统中点的坐标被转换,因此 v'是由此产生的放大点。

如果要在不同的地方进行链接缩放,则需要考虑先例的缩放因子和中心:

如果 c 是新的变焦中心, t 当前翻译, z 当前变焦因子, z2 em>是新的变焦因子,然后我们可以通过以下方式计算新的全局变换。

t'= t c *(1 -z2) z'= z * z2

这些是从将坐标系移动到缩放中心,将缩放施加到转换中并回到原点的衍生。

关于缩放中心,您必须注意鼠标输入将在窗口坐标系中,因此必须将其转换回您的视图系统(以origin为中心)。以下unproject函数确实可以:

 vector2D unproject(const vector2D &v){
     return v - origin;
 }

最后,让我们简单地实现函数,根据新输入:

转换模型视图转换
 void onMouseWheel(float mouseX, float mouseY, bool zoom_in){
     float z2 = zoom_in? 1.1 : 1/1.1;
     vector2D m(mouseX,mouseY);
     if (! (m == origin)) { // this is very likely
         trans = trans + unproject(m) * (1.0 - z2);
     }
     zf *= z2;
     // here perhaps have a redraw event fired
 }

您可以看到,我提供了或多或少的通用代码,您必须适应Win32 API的特殊性。

您想做的是将坐标转换为(0,0),缩放坐标,然后偏移(0,0)回到鼠标坐标。

Ellipse(this->MemoryDC, (INT) (((XCoordinate - XMouse) - Radius) * this->ScaleFactor) + XMouse, 
    -(INT)(((YCoordinate - YMouse) + Radius) * this->ScaleFactor) + YMouse, 
     (INT)(((XCoordinate - XMouse) + Radius) * this->ScaleFactor) + XMouse, 
    -(INT)(((YCoordinate - YMouse) - Radius) * this->ScaleFactor) + YMouse); 

最新更新