- Home /
Image becomes distorted when running on IOS
I'm making a game that runs on Android and IOS. For handling resolutions, I've made all my GUI to calculate its size based on the Screen size. For example; instead of setting a button's size to "width = 200f and height = 100f", I used "width = Screen.width 0.2f and height = Screen.height 0.1f". And in the buttons I display Image rather than Text.
Now, when running on Android, everything is fine, I tested the game in the editor (sets the platform to Android) and on multiple Android phones and the images looks fine. However when I run the game on IOS (editor and iPad) the images in the buttons become distorted as in they got that squished.
Here are 2 images that shows the difference:
On IOS:
On Android:
I think this might be due to how the image is being scaled. As in the bigger the difference between the original size and the scaled size, the more distorted the image will be. I've tried reducing the image's size to test this idea, and it does seems to have effects. However, if this is the case, then how come I do not have any problem when running on Android? Does IOS required some additional stuff for the images? Or is this a whole different problem?
Have you tried making the width and height of the image a power of 2? $$anonymous$$g. 64, 128, 256, 512.
Answer by zaid87 · Oct 02, 2014 at 07:47 AM
Okay, so I've found a possible way to fix this. I went to the images import settings in Unity and check the "Override for iPhone" and set the Format to 16 bits. The image now display the same way as it did on Android. I'm not sure if this will have any effect on performance yet, but at least it looks better now. Feels like an idiot for spending 2 days on this....
I guess Unity just handles the images differently when it comes to IOS?
Well, Android's default image setting is ETC and 16bit for transparency. 16bit doesn't require your image to be in a power of two size. iOS uses PowerVR texture compression that requires it. So, a texture that isn't POT will get stretched or squashed to be one.
Answer by ibsmithmedia · Jun 10, 2016 at 04:34 PM
@zaid87 I am a new developer and I'm struggling with this issue as well. I see that this answer is several years old, but I'm hoping to seek help in resolving my problem.
When I import images into Unity, I first change the images Texture Type to "Sprite (2D and UI)", followed by the Pivot to "Top Left" and apply. I then modify the iOS to "Override for iPhone" and format to 16 bits and apply.
When I export for Android, the images are perfect. When I export for iOS, the images squish toward the lower left corner, both short and fat.
I'm using Unity 5.3.1f Personal Edition, and Xcode 7.3.1 on Mac iOS El Capitan.
The reason I am using this version of Unity is to work with Vuforia's motion tracking capabilities, which are not yet compatible with newer versions of Unity - to my knowledge.
Any help would be greatly appreciated! My images are being used to show a video is loading, and then replaced with a Play Button image. Each are squished.
Although I'm not sure what is causing your problem, have tried you tried the comment by "screenname_taken"? It could be the cause of it.
@zaid87 @screenname_taken I'm not sure I completely understand the reply from screenname_taken. The images I've imported are (Photoshop - .jpg 3600x2400px, RGB 8 Bits/Channel). Do my images need to be saved as RGB 16bit in Photoshop before saving the .jpg and importing into Unity?
I'm saying that they need to be power of two and squares. 256*256, 512*512, 1024*1024 etc.
Your answer
Follow this Question
Related Questions
Blurry Texture Help 5 Answers
Screenshot certain layers so it doesn't show GUI Button on the image?? 0 Answers
Store/Stack Items 0 Answers
U3DXT basic Dialog box Question 2 Answers
Mobile Shader for Spotlight 0 Answers