I am making an app, and recently, out of the blue there has been a problem.
When I ran my app on my iPhone, (which I have been doing fine for the last few weeks) the images show up at completely different sizes.
For example:
The start button on the Xcode simulator is xScale 2.0f. On the iPhone it shows to be roughly half that size. I keep all the images in a .atlas file, and they are all .png. I am using sprite kit as well, and the iPhone I am using is on iOS 7.
Here is what I'm getting:
Unwanted result (As is on iPhone)
Here is what I would like:
Desired Result (As is on simulator)
This has also happened throughout the app, with other sprite nodes. Does anyone know how I can fix this problem? Thank you in advance, and I would have posted screenshots if it wasn't for the 10 rep limit.
Edit:
I have now got most of the images working, by creating a #2x version of all the images.
But there is still one graphic that is this time TOO LARGE on the iPhone. Thank you for all your help so far, does anyone know how I can make that one image smaller on the iPhone?
Your PNGs need to be labeled with a 2x or 3x. This is Apples way of accounting for the retina screens.
"ImageFileName#2x.png"
for Iphone 4,5,6
"ImageFileName#3x.png"
for Iphone 6 Plus
If you have no extension, Apple will assume it should make your image 2 or 3 times bigger to account for the extra pixels in the retina displays. If you add the #2x or #3x, Apple assumes you provided the image already accounting for the retina pixel count.
Related
My iPhone-only Objective-C app (iPad not checked) runs correctly on SE 2nd up to iPhone 12 Pro Max, properly centered, fully functional, but is stretched and clipped on any iPad (in Simulator--I blanked center content below re privacy), and on some I get black screens. Every element is constrained ultimately centered on Superview X and Y centers (nothing absolute); is that the problem? Is there a typical problem that keeps iPhone-only apps from appearing properly on iPads? The app in no way does anything special for iPads. Is there a good tutorial about this subject? Thanks
The answer is simply that constraints sufficient for all iPhones are not necessarily sufficient for iPhone in iPad. Just because the app is sized correctly for all iPhones doesn't mean it's correct for iPhone in iPad. That's what this newbie learned!
While making iOS Apps, we generally used to supply #x,#2x,#3x images. And based on my knowledge in case of android, there was some approx six different sizes
I have started working on react-native and came across the image issue.
My Question are: Do I need to provide images with all different sizes (i.e. approx 6-7 image sets by combining iOS and android) Or only 1 image and rest will be taken care internally? Will it look blurred on higher resolution phones?
Thanks.
You still need to provide multiple images. According to the Images documentation, if you are using an image named check.png, you also have to include check#2x.png and check#3x.png.
Quoting:
The packager will bundle and serve the image corresponding to device's
screen density. For example, check#2x.png, will be used on an iPhone
7, whilecheck#3x.png will be used on an iPhone 7 Plus or a Nexus 5. If
there is no image matching the screen density, the closest best option
will be selected.
I am developing a cocos2d game. I need to make it universal. Problem is that I want to use minimun amount of images to keep the universal binary as small as possible. Is there any possibility that I can use same images I am using for iphone, retina and iPad somehow? If yes, how can I do that? What image size and quality should it be? Any suggestion?
Thanks and Best regards
As for suggestions: provide HD resolution images for Retina devices and iPad, provide SD resolution images for non-Retina devices. Don't think about an all-in-one solution - there isn't one that's acceptable.
Don't upscale SD images to HD resolution on Retina devices or iPad. It won't look any better.
Don't downscale HD images for non-Retina devices. Your textures will still use 4x the memory on devices that have half or even a quarter of the memory available. In addition, downscaling images is bad for performance because it has to be done by the CPU on older devices. While you could downscale the image and save the downscaled texture, it adds a lot more complexity to your code and will increase the loading time.
There's not a single right answer to this question. One way to do it is to create images that are larger than you need and then scale them down. If the images don't have a lot of fine detail, that should work pretty well. As an example, this is the reason that you submit a 512x512 pixel image of your app icon along with your app to the App Store. Apple never displays the image at that size, but uses it to create a variety of smaller sizes for display in the App Store.
Another approach is to use vector images, which you can draw perfectly at any size that you need. Unfortunately, the only vector format that I can think of that's supported in iOS is PDF.
I am developing an iPhone game with Cocos2d-iphone.
I want my game to only be available to the iPhone 4 AND iPad. Retina enabled for iPhone 4. I don't want the game to run on older devices.
Cocos2d will always ask me for -hd and non-hd files. If I don't provide the SD files, I get errors. I don't want that: is there a way to disable Cocos2d from trying to retrieve SD files, and only get -hd suffixed files by default?
Oh, and when the game is run by an iPad, the graphics will be the -hd ones as well. So the point is, I only want to have -hd files in my project.
What are the proper steps to edit Cocos2d's source for such?
If you are using cocos2d version >= 2.0, then you can change the value of a global variable found in CCFileUtils.h:
static NSString *__suffixiPad =#"-hd";
(Its default value is #"-ipad".)
If you are using cocos2d version < 2.0, then you can find here a category that I wrote to be able to transparently use -hd images created for the iPhone 4 on the iPad 1/2.
Actually, it does more than that, but if you add it to your project, then "-hd" images will be "automagically" used on the iPad 1/2 instead of their SD versions (which you could also not include in your project).
Let me know if you have any issues integrating this code.
If I would have been at your place.. I would have played with a trick.. Don't down vote the answer if you don't like.. But Its just a thing in my mind.
Use -hd images in the code directly.. iPhone 4 will handle it easily.. Older iPhones will show it much larger and it doesn't matter as you are not supporting them...
So instead of using Background.png , directly use Background-hd.png as it will work fine for iPhone 4.. Instead of wasting time on all these SD stuff.. I will directly use my -hd images for my work...
I can not say about new iPad.. But old iPad can easily use -hd images in code as you want.. For iPad I have directly used in my code earlier..
Hope this helps.. :)
This tutorial might help.
If you only provide -hd assets, you should only get errors regarding missing SD assets when running on iPad. The iPad doesn't have a Retina display, but it certainly is high resolution enough to be treated like one.
Since cocos2d passes all filename requests through the fullPathFromRelativePath function in CCFileUtils it may be enough to modify this function to treat the iPad like an HD device and force it to load -hd assets on iPad.
the 1st idea i can think of is to use #2x suffix for images (UIKit style) and you wont need to enable retina display in app.The problem is that on the ipad you'll have to write your own method to remove #2x suffix
the 2nd idea was to make a SD image..but only 1x1 pixels... it takes virtually no space at all ( 119 bytes with white pixel). Should work on ipad as-is
3rd idea:don't enable (or enable..doesn't make any difference) retina display but have the HD images as SD images.I've tested this on cocos2d v1.0.1 and it seems to work.Also..it should work on ipad
4th idea forcefully enable retina display in ccConfig.h (so that director won't ask you for the SD images on ipad) .I'm not sure about this one because there are quite a few tests that check for resolution, device and if it's retina and you'd have to edit all of them
these are just ideas off the top of my head..they may be wrong..but they're just ideas
The images on a few UIButtons are getting scaled down way smaller on the iPhone 4 compared to how the show up on interface builder, the iPhone simulator or an iPhone 3G.
How can I ensure the button images stay the same size as they appear in IB?
Do you have two images, e.g. one for 320*480 and one for 640*960 screen resolution? E.G one file named myImage.png and one named myImage#2x.png?