SFML中Button精灵显示位置与点击区域不符问题求助

问题概述 #

用C+++SFML开发游戏，按下Esc弹出UI菜单，Button类负责创建带纹理的按钮。当前遇到问题：按钮精灵位置设置为(0,0)，但实际显示在(200,200)左右区域，触发按钮回调需点击(0,0)位置；打印精灵位置显示为(0,0)，已排除纹理本身问题。

原因分析 #

• 视图(View)变换导致坐标脱节：主窗口大概率使用了自定义View（比如跟随玩家移动的视图），所有绘制元素会被视图变换偏移，而sf::Mouse::getPosition(window)获取的是原始窗口像素坐标，未经过视图转换，导致点击判定坐标和实际显示坐标不匹配。
• Button构造函数未利用传入的位置参数：当前构造函数硬编码精灵位置为(0,0)，完全忽略了传入的x、y参数，虽不是当前显示偏移的核心原因，但会影响后续功能扩展。

解决方案 #

1. 修正鼠标坐标的视图转换 #

将鼠标的窗口像素坐标转换为视图对应的世界坐标，再进行点击判定，确保判定坐标和显示坐标一致。

2. 修复Button构造函数的位置参数使用 #

利用构造函数传入的x、y参数设置精灵位置，避免硬编码带来的扩展性问题。

修改后的代码示例 #

修正Button的handleEvent方法 #

void Button::handleEvent(const sf::Event &event, const sf::RenderWindow &window)
{
    if (event.type == sf::Event::MouseButtonPressed)
    {
        if (event.mouseButton.button == sf::Mouse::Left)
        {
            // 将鼠标事件中的窗口坐标转换为视图下的世界坐标
            sf::Vector2f mouseWorldPos = window.mapPixelToCoords(
                sf::Vector2i(event.mouseButton.x, event.mouseButton.y)
            );
            sf::FloatRect bounds = buttonSprite.getGlobalBounds();

            if (bounds.contains(mouseWorldPos))
            {
                if (onClick)
                {
                    onClick();
                }
            }
        }
    }
}

修复Button构造函数 #

Button::Button(float x, float y, float wf, float hf, std::string path, std::function<void()> callback)
    : onClick(callback)
{
    if (!buttonTexture.loadFromFile(path))
    {
        std::cerr << "Error loading tilesheet from " << path << std::endl;
    }
    buttonSprite.setTexture(buttonTexture);
    // 使用传入的位置参数设置精灵位置
    buttonSprite.setPosition(x, y);
    buttonSprite.setScale(wf, hf);
}

内容的提问来源于stack exchange，提问作者Abbadon