SamYan
-
Content Count
22 -
Joined
-
Last visited
-
-
-
Hi, Can anyone tell me please what the best way to hide a "BETTING CONFIGURATION" container by clicking anywhere on the screen other than that container? Actually i'm detecting the mouse coordinates and comparing with the window / container coordinates, but it's good practice? public static isColliding(mouse: any, object: any): boolean { return !(mouse.x < object.x || mouse.x > (object.x + object.width) || mouse.y < object.y || mouse.y > (object.y + object.height)); } this.baseContainer.interactive = true; this.baseContainer.addListener('pointerdown', () => { if (Utils.isColliding(this.mouseCoord, betConfigUI)) { console.log('you are in window space'); } else { console.log('you are not in the window space'); } }) Thanks in advance!
-
Finally i got it! Thank you friend!
-
-
-
-
Thank you friend! It's working!!
-
Ivan, Do you know any way to manage the diferentes screen in pixijs ?
-
https://codesandbox.io/s/n5pkq5vjpj?moduleview=1
-
Thank you very much!
-
-
i dont understand, why resizing canvas, its not resizing the stage and children containers correcty.
-
It's background: desktop screen: mobile screen:
-
Thanks for response but not working. I have tried to give the max size of the background to my view and now it's working, but when i try in mobile screen, fails again. http://jsfiddle.net/om0hskfy/
-
-
-
Thanks for response but still not working. I'm looing and it's the stage scale problem (app.stage.scale). I can't calculate the aspect ratio for stage. IVAN I NEED YOUR HELP. 😅
-
Nobody can help please?
-
Thanks for response but i get the same result. Not working.
-
Hi, i'm looking to get any solution form resizing the 'game' correctly in desktop and mobile screens but no way. I get the background image (sprite) non centralized and zoomed stage. Anyone can tell me please what's the wrong? CSS body { background-color: rgb(0, 0, 0); width: 100%; height: 100%; overflow: hidden; } #pixi-canvas { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } JS const logicalWidth = 1280 // window.innerWidth; const logicalHeight = 720 // window.innerHeight; // Init Application let app: PIXI.Application = new PIXI.Application(logicalWidth, logicalHeight, { backgroundColor: 0x2c3e50, roundPixels: true, resolution: window.devicePixelRatio, autoResize: true }); app.view.id = 'pixi-canvas'; // Add canvas to DOM document.body.appendChild(app.view); { ... } let background: PIXI.Sprite = PIXI.Sprite.fromImage("bg"); rootContainer.addChild(background); app.stage.addChild(background); { ... } this.resizeHandler(app.stage, app.renderer, logicalHeight, logicalWidth); window.addEventListener('resize', () => { this.resizeHandler(app.stage, app.renderer, logicalHeight, logicalWidth); }); private resizeHandler(stage: PIXI.Container, renderer: any, logicalHeight: number, logicalWidth: number) { const scaleFactor = Math.min( window.innerWidth / logicalWidth, window.innerHeight / logicalHeight ); let newWidth: number = Math.ceil(logicalWidth * scaleFactor); let newHeight: number = Math.ceil(logicalHeight * scaleFactor); console.log('size', {w: logicalWidth, h: logicalHeight, newW: newWidth, newH: newHeight, scaleFactor: scaleFactor}); renderer.resize(newWidth, newHeight); stage.scale.set(scaleFactor); }; RESULT
-
SamYan changed their profile photo
-
-
