phaser icon indicating copy to clipboard operation
phaser copied to clipboard

Issue when adding frame with CanvasTexture only in CANVAS mode (IPad Air 2)

Open DanielRabascoGarcia opened this issue 3 years ago • 5 comments

Version

  • Phaser Version: Phaser v3.54.0 and Phaser v3.60.0-beta3

Description

Adding a New Frame to CanvasTexture and creating an image from it, doesn't work in CANVAS mode with IPad Air 2 and ios15.

Example Test Code

myCanvasTexture = scene.textures.createCanvas(
            `canvasName`,
            WIDTH,
            HEIGHT
);

// Create puzzle piece inside (I can't show the real code)

myCanvasTexture.add('frameName', 0, myX, myY, myWidth, myHeight)

// This is not needed in CANVAS mode, only in WEBGl
myCanvasTexture.refresh()

// This image is not shown
scene.add.image(x, y, 'canvasName', 'frameName' )

Additional Information

The piece of code shown above works in Windows in every browser as well as in Android. It even works in some Apple devices like IPhone 11 with ios15, but it fails in some point in IPad Air 2 (I think it doesn't work in IPhone X neither).

If I remove the adding frame part like that, it works:

 myCanvasTexture = scene.textures.createCanvas(
            `canvasName`,
            WIDTH,
            HEIGHT
  );           
  
  // Do stuff
  
  // This image is shown
  scene.add.image(x, y, 'canvasName' )

DanielRabascoGarcia avatar Oct 28 '21 15:10 DanielRabascoGarcia

How big is this texture? What are WIDTH and HEIGHT values?

vforsh avatar Oct 28 '21 16:10 vforsh

How large is this CanvasTexture? What is the width and height? I'd guess it's just too large for the iPad. Or, it's possible the frame dimensions are invalid (non-integer? exceed the texture bounds?)

photonstorm avatar Oct 28 '21 16:10 photonstorm

I can reproduce with any value of Width and Height that I've tried. For example, 300x300. These values depends on the number of pieces of the puzzle.

If it was to large for the IPad, won't make sense that the code that I show in the additional information crashed too? The frame dimensions are the same in all devices, why would it fail only in some Apple devices?

Due the this bug (or not bug) I've realized that I didn't need to use frames, as drawing the canvas and painting the hole texture worked! However, I'll keep trying to figure out why that happened.

Is it possible that for some reason, if I set the frame size with the same values than the canvas, like:

 myCanvasTexture = scene.textures.createCanvas(
            `canvasName`,
            WIDTH,
            HEIGHT
  );           
  myCanvasTexture.add('frameName', 0, 0, 0, WIDTH, HEIGHT)
  
  // This image is shown
  scene.add.image(x, y, 'canvasName' . 'frameName')

The code fails in some point only in CANVAS mode in some devices?

DanielRabascoGarcia avatar Oct 29 '21 07:10 DanielRabascoGarcia

"The frame dimensions are the same in all devices, why would it fail only in some Apple devices?"

Because not all hardware is built the same and newer models have much better GPUs and can cope with more and bigger textures than old devices like an Air 2, which is now 7 years old.

If this only fails on an iPad Air 2 then it will not be fixed by me, someone else will have to debug and contribute a fix for it, as I don't own the hardware and won't buy it specifically for this edge case, sorry.

photonstorm avatar Oct 29 '21 15:10 photonstorm

Ok! Thank you very much for the help!

DanielRabascoGarcia avatar Oct 29 '21 15:10 DanielRabascoGarcia