Ktx2 flipped vertically on ios

recently I have noticed that some of my textures are flipped vertically. This only seems to happen when:

  • The texture is ktx2
  • The texture is converted from a 32 bit png
  • The texture is viewed on iOS

I have a playground representing the issue here: https://playground.babylonjs.com/#Q9VZS9#814

On all devices except iOS, the polygon’s texture is green at the top and red at the bottom.

On iOS I see red at the top and green at the bottom.

The command line I used to convert the png to ktx2 was:
toktx --genmipmap --bcmp --clevel 5 red-top3.ktx2 red-top3.png

Is there any way this could be fixed so the ktx2 texture is the same orientation on all platforms?
Here are the textures used:
ktx2Test.zip (1.2 KB)


cc @bghgary

I can repro. Seems like a bug to me. Do you mind filing one on GitHub to track? Thanks.

1 Like

Thanks for confirming the issue @bghgary
I’ve created the following Github issue: 32 bit Ktx2 textures are flipped vertically on ios · Issue #12349 · BabylonJS/Babylon.js · GitHub


1 Like

It looks like we are seeing differences between iOS versions. If you have an iOS device and happen to be reading this thread, can you try this PG (from above), post your iOS version, and screenshot of the result? Thanks.

@Charge Which is supposed to be the correct orientation for this image?

Ah, that’s interesting. I can confirm that I found the issue on iOS 15.3.1.
When I first saw the issue, I wondered if it may be related to the change made here: Fix ETC1 decision tree in ktx2Decoder by bghgary · Pull Request #11491 · BabylonJS/Babylon.js · GitHub as the code path was changed for alpha textures for iOS.

The correct orientation (based on what I see on any non-ios device) should be green at the top and red at the bottom

It appears this is fixed in iOS 15.4, but note that there are some issues with 15.4 that will hopefully be addressed by Apple soon.

That’s good to know, thanks @bghgary.
Out of interest, is it fixed because apple re-introduced support for ETC2 or PVRTC in iOS 15.4?

Did they? I didn’t actually check. If this is true, then we still have a bug.

Sorry @bghgary, I was asking you if Apple re-introduced ETC2 or PVRTC in iOS 15.4. I did not mean to imply that it has been added.

I guess it would be good to check either way. :slight_smile:

1 Like

Thanks to @sebavan for checking with WebGL Report. It seems to indicate that you are right, PVRTC and ETC2 have been added back. So that means we may still have an issue with ETC1.

1 Like

Thanks for double checking that @bghgary & @sebavan :+1:
I’m actually upgrading my iPhone now to check the extensions before and after

1 Like

Hi @bghgary,
after reading the suggestion made by @Evgeni_Popov on the Github issue, I created a playground where I force internalTexture.invertY = false and this does fix the issue, with the texture orientation being the same on iOS as it is on my PC.
Please see: https://playground.babylonjs.com/#Q9VZS9#828

Yes, sorry for the slow response. I am going to fix this better but I’m swamped at the moment. Setting invertY will work as a workaround as well as updating iOS to 15.4.

1 Like

We’ve decided to close the GitHub issue as Apple added back support for the compressed textures in newer versions of iOS. The overall better fix is more complicated to implement and I filed a separate issue for this here: Make invertY flag more consistent across different texture loading scenarios · Issue #12545 · BabylonJS/Babylon.js (github.com).