Skip to content

Fixes updating BlazorGameWindow.ClientBounds & mouse/touch positions#2593

Open
squarebananas wants to merge 2 commits into
kniEngine:mainfrom
squarebananas:ClientBoundsPosition
Open

Fixes updating BlazorGameWindow.ClientBounds & mouse/touch positions#2593
squarebananas wants to merge 2 commits into
kniEngine:mainfrom
squarebananas:ClientBoundsPosition

Conversation

@squarebananas

Copy link
Copy Markdown
Contributor

Currently Kni.BlazorGL only works correctly when the canvas is a full viewport element located at the origin position (using an Iframe also works as internally it acts like the whole viewport). If the canvasHolder is reposition/resized to appear elsewhere then the canvas doesn't update correctly. The mouse/touch input positions are also wrong.

The existing JsWindowOnResize event cannot be used for partial viewport / non origin element locations either, as the full window size values will not be applicable in these cases.

To resolve these issues, this PR ensures the BlazorGameWindow.ClientBounds match the actual canvasHolder position and size. This is then used to update theCanvas size, call UpdateBackBufferSize, and adjust mouse/touch input positions accordingly.

Also the templates currently set both the canvasHolder and theCanvas to use the css position of fixed. However this means theCanvas doesn't actually get placed inside the canvasHolder and instead acts like it is floating separately from it. By changing theCanvas to use a css position of absolute, it instead is placed inside the canvasHolder and is repositioned accordingly.

The associated required Wasm changes ("Adds DOMRect and Element.GetBoundingClientRect") are located here:
nkast/Wasm#18

@squarebananas
squarebananas force-pushed the ClientBoundsPosition branch from aea9ac3 to 556e6c9 Compare July 24, 2026 14:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant