So I'm building an app for 4.x devices and I'm wondering if I can just use one set of assets at double resolution instead of one set with a #2x id and another set without.
Basically im asking can the older 3g and 3gs just use the #2x assets? and do the right thing with them?
anyone have experience with this?
Thanks
You're better off using two sets of resources, one for the high resolution retina displays and one for the older displays. Downsizing #2x graphics won't look pretty and will impact performance, especially on 2G iPod Touches.
The older devices can use the #2x but as far as I understand you'll need to:
Set your UIImageViews to scale the images to fit.
Hardcode image references to the new images.
Expect poor image quality and slower performance on non-retina devices.
Overall, it's better to provide two copies of the images, "bob.png" and "bob#2x.png" then reference them in code as "bob.png".
NB. As of iOS4 you can reference the images without their file endings, so just "bob" would work; however this has compatibility implications with devices running pre-iOS4 : the images won't be found. So for maximum compatibility include the file endings if you intend on deploying to both iOS4 and iOS3.x.
They technically can, given you make sure they're scaling the right way (e.g. if it's an image view that it's set to scale up/down).
However it's not recommended in most situations, mainly because it'll be slower, uses more resources, and leads to shorter battery life. Also, depends on your resources but an artwork scaled down by a factor of 2 doesn't have the same quality as one that is resampled specifically for the new size.
Related
If i want my application to be compatible with the Retina display, am i obliged to recreate all my images by doubling their sizes? even the icon?
if you will not use high resolution images your images will look pixelated/blurr.So better to use high res images as well.Some Key points are:
Displaying graphics depending on the device model can be done by duplicating image files and adding an ‘#2x’ suffix. So, when the normal image file is named ‘button.png’, the hi-res version should be ‘button#2x.png’.
You don’t need any additional code for this. In Interface Builder or your code, assign the normal version (without the suffix) to an object. The same goes for the application icon. The resolution of the 2x icon should be 114 by 114 pixels. You will need to add a separate ‘Icon’ property in the Info.plist file for this icon.
If for some reason you do want to perform a check in your code, you can do so by checking the scale factor of the display. Older models will return a scale factor of 1.0, while the iPhone 4 will return 2.0. You can check this with:
float factor = [UIScreen mainScreen].scale;
Depending on the type of application you’re developing further optimizations can be made to utilize the new retina display the best you can.
A very good information here
hope it help you :)
You're not obligated, it just will look very pixelated if you don't.
As for the icon, I believe you are obligated to provide multiple sizes when submitting to the AppStore.
Maybe you'll want to take a look at iRetiner.
You could also check this previous stackoverflow thread : how to set image for ipad application that support retina display
A summary of the icons and what is required can be found in the human interface guidelines. I highly recommend providing high resolution artwork for the retina display even though it is not required. Your default now should be to design artwork at the higher resolution, then scale down for older devices. I doubt Apple would choose to highlight an application as new and noteworthy if it looks pixelated on the latest devices.
There are people who insist that for changing design from TFT to Retina we should redesign all app.
But I have read that we can change only app's images ,and it's enough.
I want to know which is the best practice for it and which solution is acceptable??
Retina Display is just Apple's name for the high resolution display on some of its devices -- it's still a TFT (thin film transistor) LCD display, though.
The Retina Display has twice as many pixels in each direction as the non-Retina version. iOS features a mechanism for providing both high resolution and standard resolution images, so that the high-res versions will be used if needed. All you need to do is include high-res versions of your images with the same names and their standard-res counterparts and the "#2x" suffix. Of course, having that higher resolution available means that you might want to add detail to your images or otherwise redesign your app to take full advantage of the screen's capabilities, but it's not a requirement. In fact, you don't need to do anything at all -- your existing app will work just fine without any changes.
It depends on your app.
In many cases simply including the hi-res versions of your images will be all that you need to do.
However, if you have any custom drawing that could benefit from the extra resolution, then you'll need to considered updating that code too.
I'm hoping to recursively change every single View in my application to use the iPhone 4 graphics, and change the content scale factor to 2.0, such that it's the zoomed in version of my iPhone application on the iPad by default.
Currently, the iPad starts out in x1 Zoom, which is the 320x480 pixel version displayed on the 1024x768 real estate of the iPad, where the powers that be have declared that they're too cheap to actually invest in an iPad app, instead requesting that we have the application use iPhone retina graphics with a default content scale factor of 2.0
Upon googling and searching stackoverflow it seems my query is unique, though some questions are sort of similar such as -> Problem adapting scale factor for iPad x2 compatibility mode
And the best way to go about doing this remains undocumented, so I hope to implement this 'hack' so to speak in the best most succinct way possible.
If anyone has done this before, please share the code, otherwise I will update this with my own answer once I've figured it out.
The Answer: THIS CANNOT BE DONE.
The iPad will treat the screen as 480x320, even at 2x, so even if you change the contentScaleFactor appropriately and force it to use #2x.png images, you won't get any better resolution.
This is built into the iphone Operating system, only the Jailbroken iPads can get around this. Which isn't an option to consider.
It's easier to just duplicate the target for iPad, and realign the nib files appropriately, and make the app a Universal App.
It's a daft idea, and even if Apple change this in future SDK releases, it won't be backward compatible which again isn't an option, at least for our development team.
I think the best way to do it rules out using nib files.
If you create your views in code, you can easily use conditional code ([[UIDevice currentDevice] userInterfaceIdiom]) and based on that set the scale for the UIView elements.
Our graphics guy just gave me the sliced images for an Application we're building, but he only gave me the resolution for the 960x640 iPhone 4 res.
And advised that I can just scale the images down for 3g at runtime, so the resolution/image size remains the same but it's just displayed at half size.
The question: Is this allowed when submitting to the app store, or is it a requirement to have for example:
IMAGE1#2x.PNG (460x640) - iPhone 4
IMAGE1.PNG (230x320) - iPhone 3g
For all images.
I might just do the batch conversion and have two resolutions for all images, to save maximum space.
That's allowed, but obviously the images will occupy four times as much RAM on the older devices than they otherwise would, having four times the pixels. While the iPhone 4 has 512mb of RAM, the 3G and the original have just 128mb. Though assuming you are dealing with memory warnings correctly and everything will still fit, the main side effect will be performance issues whenever things are purged and later reloaded from disk (which, as I'm sure you're aware, is handled automatically for view controllers in NIBs). Based on empirical observations, the flash memory on pre-3GS devices is a lot slower than the later stuff so even if you're sticking with the large images it would make sense to attempt to minimise on-disk size.
Best practice that has worked for me is to make my retina image, then scale it down by 50%.
In order for the retina display to use the larger image, the #2x MUST be apart of the larger image. Your example is the way it should be used.
I would do the batch scaling ahead of time for sure. If for no other reason than the iPhone chooses whether or not to display the IMAGE1.PNG or the IMAGE1#2X.PNG depending on the resolution of the screen. In your code you always just reference IMAGE1.PNG. You don't have to make any coding changes. If you scale them at runtime you will have to override all of your calls to any UIImage type of thing.
IMHO, You are likely to miss one or else Apple is likely to release a different configuration of phone that will cause you to have to rework all of your code that is checking for screen resolution.
i just have a 3gs for testing (here in romania i still cant get a iphone 4)
When I just create full screen images for iPhone 4 .. would they be displayed resized on the 3gs?
I just cant make a bundle version for 3gs and 4 with 2 times my images, they are already a lot. Do I have to make now 2 Apps ??
Could this be a trick: In my xib i define a 320x480 UIImageView (it will be resized automaticly on the iPhone4) when I there define "scale to fill" and make high resolution images, would they come more sharp on the iPhone 4?
Now I am just wondering how to work best right now for big animations.
thx
Just found out in my case its fine to use higher resolution pics into a 320x480 frame like for 3GS and make Aspect FILL.
When I test on a iPhone 4 Simulator it shows much higher resolution and same on iPad if I click 2x :)
you can also create alternative high resolution images with a name ending in "#2x". so if you have an image called "arrow.png", create one with twice the resolution called "arrow#2x.png" and the iphone 4 will use that.
check out this article: http://thomasmaier.me/2010/06/dealing-with-iphone-4-resolution-2x-inside-of-photoshop/
Try it and find out, but my suspicion is that even if they do work, they won't work on OS 3.0 or OS 3.1, and plenty of people have not upgraded yet.
Also note that even if it displays them at half-size, I'm pretty sure that they'll still be "#2x" images. This means they'll use more memory and generally perform worse.
What's wrong with adding a handful of new images? The normal-size images are a lot smaller than the #2x images.
EDIT: If you have a lot of images, you may find it beneficial to use JPEGs where appropriate (e.g. for photos or photo-like backgrounds). I'm not sure, but I think they should work with +[UIImage imageNamed:] though you might have to specify ".jpg" explicitly.