Fixed resolution problems.

This commit is contained in:
Uwe Oestermeier 2024-05-27 13:52:15 +02:00
parent 3092eb53cb
commit ee76c41a2b

View File

@ -71,7 +71,7 @@ export default class PIXIApp extends PIXI.Application {
* @param {HTMLElement} [opts.view] - The canvas HTML element. If not set, a render-element is added inside the body. * @param {HTMLElement} [opts.view] - The canvas HTML element. If not set, a render-element is added inside the body.
* @param {boolean} [opts.transparent=true] - Should the render view be transparent? * @param {boolean} [opts.transparent=true] - Should the render view be transparent?
* @param {boolean} [opts.antialias=true] - Sets antialias (only applicable in chrome at the moment). * @param {boolean} [opts.antialias=true] - Sets antialias (only applicable in chrome at the moment).
* @param {number} [opts.resolution=window.devicePixelRatio | 1] - The resolution / device pixel ratio of the renderer, retina would be 2. * @param {number} [opts.resolution=window.devicePixelRatio || 1] - The resolution / device pixel ratio of the renderer, retina would be 2.
* @param {boolean} [opts.autoResize=true] - Should the canvas-element be resized automatically if the resolution was set? * @param {boolean} [opts.autoResize=true] - Should the canvas-element be resized automatically if the resolution was set?
* @param {number} [opts.backgroundColor=0x282828] - The color of the background. * @param {number} [opts.backgroundColor=0x282828] - The color of the background.
* @param {string|Theme} [opts.theme=dark] - The name of the theme (dark, light, red) or a Theme object to use for styling. * @param {string|Theme} [opts.theme=dark] - The name of the theme (dark, light, red) or a Theme object to use for styling.
@ -81,6 +81,7 @@ export default class PIXIApp extends PIXI.Application {
* @param {boolean} [opts.roundPixels=true] - Align PIXI.DisplayObject coordinates to screen resolution. * @param {boolean} [opts.roundPixels=true] - Align PIXI.DisplayObject coordinates to screen resolution.
* @param {boolean} [opts.monkeyPatchMapping=true] - Monkey patch for canvas fullscreen support on large displays. * @param {boolean} [opts.monkeyPatchMapping=true] - Monkey patch for canvas fullscreen support on large displays.
* @param {boolean} [opts.adaptive=true] - Adds Graphics adaptive calculation of quadratic curve and arc subdivision. * @param {boolean} [opts.adaptive=true] - Adds Graphics adaptive calculation of quadratic curve and arc subdivision.
* @param {boolean} [opts.autoDensity=true] - Automatically adapts width to devicePixelRation
*/ */
constructor({ constructor({
width = null, width = null,
@ -90,7 +91,7 @@ export default class PIXIApp extends PIXI.Application {
backgroundColor = 0x282828, backgroundColor = 0x282828,
theme = 'dark', theme = 'dark',
antialias = true, antialias = true,
resolution = 1, resolution = window.devicePixelRatio || 1, // Needed for text resolution https://www.html5gamedevs.com/topic/46418-text-and-resolution/
autoResize = true, autoResize = true,
fpsLogging = false, fpsLogging = false,
progress = {}, progress = {},
@ -98,7 +99,8 @@ export default class PIXIApp extends PIXI.Application {
roundPixels = true, roundPixels = true,
monkeyPatchMapping = true, monkeyPatchMapping = true,
adaptive = true, adaptive = true,
graphql = false graphql = false,
autoDensity = true // Needed for text resolution https://www.html5gamedevs.com/topic/46418-text-and-resolution/
}) { }) {
const fullScreen = !width || !height const fullScreen = !width || !height
@ -116,7 +118,8 @@ export default class PIXIApp extends PIXI.Application {
resolution, resolution,
autoResize, autoResize,
backgroundColor, backgroundColor,
forceCanvas forceCanvas,
autoDensity
}) })
this.width = width this.width = width