Skip to content

Flag to not change canvas CSS on scale factor change #3023

Description

@OptimisticPeach

I have my canvas's size change automatically using css with a width: 100%; height: 100% style that's applied to the canvas on creation.

I then watch for changes to the canvas's actual size with a ResizeObserver, quite similar to what's done here: https://github.com/BVE-Reborn/rend3/blob/trunk/rend3-framework/src/resize_observer.rs

However, when dpi gets changed, winit will change the styling of the canvas element to no longer be my width: 100%; height: 100%.

I mitigate this using the following code placed in my handler for a winit size changed event:

#[cfg(target_arch = "wasm32")]
{
    use winit::platform::web::WindowExtWebSys;
    let canvas = window.canvas();
    let style = canvas.style();
    // reset styling
    style.set_property("width", "100%").unwrap();
    style.set_property("height", "100%").unwrap();
}

(Included for anyone reading this facing the same issue)
(This needs to go in a resize event, not a scale factor changed event, since winit changes the canvas style after I handle that event, but before I handle the resize event)

However, this is clearly a hack, and I am wondering if there's an existing method to do this correctly, and if not, this issue can be interpreted as a request for such a method.

Metadata

Metadata

Assignees

No one assigned

    Labels

    DS - webAffects the Web backend (WebAssembly/WASM)

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions