themoonrat Posted May 7, 2019 Share Posted May 7, 2019 I've come across a problem that I think is a bug in iOS / Mac safari canvas implementation, and wondering if anyone else has come across it or found any work arounds. http://moonrat.co.uk/html5/ios-text-gradient-scale/ Here are 3 implementations of the same effect in native canvas, in phaser 3 and in pixi 5. It's text with a gradient and a drop shadow, but with the text scaled down to 0.75 scale. On a desktop / android / mac / linux / anywhere, you'll see it looks correct, like: https://i.imgur.com/1qPV0r9.png But on ios the drop shadow is in the wrong place: https://i.imgur.com/bhfo6zN.png - If the scale is set to 1, then it works correctly, but anything else and it's all over the place. At first I thought it was an error I'd introduced in pixi v5, but i tried phaser 3 and it has the same issue. I then tried just using the canvas api, and it happens there too. This occurs on ios 11 and ios 12 (not tried earlier) It's crazy. I've often used lower resolution text on lower end devices for performance reasons, so this is a real killer to being able to do that. Any ideas? Or Workarounds? Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted May 7, 2019 Share Posted May 7, 2019 Did you report it or at least search through bugtrackers? Quote Link to comment Share on other sites More sharing options...
themoonrat Posted May 7, 2019 Author Share Posted May 7, 2019 Not reported yet, bed time after a frustrating day battling this couldn't find it mentioned tho. Quote Link to comment Share on other sites More sharing options...
themoonrat Posted May 8, 2019 Author Share Posted May 8, 2019 https://bugs.webkit.org/show_bug.cgi?id=197689 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.