Emscripten SDL2 - canvas 的原点似乎在 canvas 调整大小时移动

Question

我刚刚在我正在处理的项目中实施了 sdl2 canvas 的大小调整。阅读 html5.h 的 emscripten 文档，有一个函数可以在 window 调整大小事件

上设置回调

设置回调函数

EMSCRIPTEN_RESULT isSetCallback =
  emscripten_set_resize_callback(EMSCRIPTEN_EVENT_TARGET_WINDOW, mImpl->state, false, captureResizeEvent);
if (isSetCallback != EMSCRIPTEN_RESULT_SUCCESS)
{
  throw std::string("Unable to set resize callback with EMSCRIPTEN_RESULT code %d\n", isSetCallback);
}

回调函数

EM_BOOL captureResizeEvent(int eventType, const EmscriptenUiEvent *e, void *rawState)
{
  int newWidth = (int) e->windowInnerWidth;
  int newHeight = (int) e->windowInnerHeight * hconstants::MAX_DIM_RATIO;

  emscripten_set_canvas_element_size("canvas", newWidth, newHeight);

  return 0;
}

使用此代码 canvas 可根据需要正确调整大小 - 将其宽度设置为 window.innerWidth 并将高度设置为常量 * window.innerHeight。但是，canvas 的原点似乎并没有留在左上角。

我使用下面的代码在原点附近绘制了一个宽度和高度为 5 像素的正方形。它最初有效，但在垂直调整 canvas 的大小后，原点似乎垂直移动。

SDL_Rect shape;
shape.x = 5;
shape.y = 5;
shape.h = 5;
shape.w = 5;
SDL_RenderDrawRect(mImpl->renderer, &shape);

在调整 the black square can be seen near the top left corner as expected. But after resizing 大小之前，原点似乎从左上角向下漂移。我还在整个 canvas 周围画了一个黑色方块，这就是为什么第二张图片中出现了一条黑线（同样是因为原点似乎从左上角移动了）。

我已经使用元素检查器验证 canvas 物理上仍然在左上角，并且在调整大小后它实际上没有向下移动页面。

有人知道如何解决这个问题吗？

编辑：我刚刚尝试删除 SDL_Renderer 并从 window 创建一个新的，但仍然没有解决问题。

Answer 1

好的，所以我有一个可行的解决方案，但我仍然愿意听取任何更好的解决方案。

我最终只是删除了 SDL_Renderer 和 SDL_Window 对象并在回调函数中重新创建了它们。我意识到这是非常低效的，但我无法找到任何其他有效的解决方案，所以现在必须这样做。

Emscripten SDL2 - canvas 的原点似乎在 canvas 调整大小时移动

Emscripten SDL2 - Origin of canvas appears to move when canvas is resized

javascript

c++

canvas

emscripten

sdl-2