As we know iPad 3 have 2048×1536 resolution.
for iPhone 4 with retina display we put big image with name #2X and one normal image in our bundle.
so for iPad 3 application development we also need to put two images one is normal size and other with big size with #2X name..?
Any one know please reply.
With the iPad 3, you also simply need to name your retina images foo#2x.png. It needs to be exactly two times the resolution of the corresponding foo.png. So, say foo.png is 10x10, then your foo#2x.png needs to be 20x20.
You can also make version specifically for iPhone/iPod or iPad and iOS will automatically chose the correct version. For this, you can use the ~iphone and ~ipad modifiers:
foo.png for all devices with non-retina display
foo~iphone.png specifically for iPhone/iPod non-retina
foo~ipad.png specifically for iPad non-retina
foo#2x.png for all devices with retina display
foo#2x~iphone.png specifically for iPhone/iPad retina
foo#2x~ipad.png specifically for iPad retina
You can mix them in any combination, as long as there's always a version for all your supported devices (if you're doing an iPad-only app there's no need to provide images for iPhone, of course). So it's OK to provide for example foo~iphone.png, foo~ipad.png and then foo#2x.png.
I think it would be "image~ipad" & "image#2x~ipad" for iPad with Retina Display if you are writing a Universal app (since "image" & "image#2x" are for iPhone/iPod images).
Otherwise I guess "image" & "image#2x" is OK.
Refer to How to support both iPad and iPhone retina graphics in universal apps .
Related
For a new project my client wants to cover all iPhone and iPad sizes. For icons and sprites I'm not really gonna change the shapes of the images, but I'm in a bind with assets for my background images.
Looking at http://iosres.com I was wondering if there is some logic to cover both Landscape and Portrait 3:4 and 9:16 in one asset or should I simply make a set of iPhone and iPad and use UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad to figure out what to show before loading my views?
Also I'm wondering what's most effective for all the different device sizes. I know from experience that an iPad 3 wouldn't like to have a background image loaded on 4k resolution and that you want to avoid pixel differences so it won't trigger scaling in UIImageViews. Will iOS automatically figure out that the iPad 3 will use like the #1x variations, whereas the iPad Pro will load the #3x versions?
Yes iOS will automatically figure out which image to load at runtime and load #1x #2x or #3x depending upon the type of device. You don't need to do anything like UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad for each image.
Edit:
You can also add ~ipad suffix in image names so iOS will pick the appropriate background image for iPhones and iPads. i.e. image_name#2x~ipad.png and image_name#2x.png.
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.
How can one create a iOS7 Icon in Images.xcassets with Xcode5? I've searched many places, but i did not find what the required Icon sizes were.
My App is for iOS7+.
Here is a screenshot:
I've added some icons below in the AppIcon.appiconset folder in mac. Do I need to add in the xcode side bar? What are the required sizes for the AppIcon.appiconset folder?
This is very easy & in-fact it is self explanable. You need not even have to think about the name of the icons. The only thing that you need to worry about is the sizes. Here is how to infer the sizes out of that screen.
BASIC RULE : Multiply the 1x or 2x shown in the empty box with the pt value under it. When there are two boxes like 1x & 2x for the same pt value, let's say 40pt, it means you have to provide both the sizes of images. 40x40 & 80x80 .
Make sure if your app is Universal or Device specific. Based on that, you need to provide the icons.
Point to be noted Images.xcassets doesn't sizes your files. It is just a catalog where you add the files of specific sizes.
Now let's say you have a myIcon.png file of a bigger size (its always better to create your app icon with a size of 1024x1024, if not then at least 512x512).
Open the Images.xcassets & now read each empty icon elements. There is the size name provided, already.
NOW CONCENTRATE : If empty dasshed box reads as 2x & text below reads as iPhone Spolight - iOS 5,6 Settings - iOS 5-7 29pt, then it is actually seeking an image double the size of 29pt, So you need an image size of 58x58
You just need to re-size your actual image using any editor (previewer is the best editor) & create the specific size. Save it some where & drag upon that specific Box.
You are done.
Here is a sample to read it. Hope that makes all your doubt clear going forward.
You need not have to worry about naming conventions of images when using Images.xcassets
Once you have all your images ready, just drag & drop it into the Images.xcassets in Xcode itself. Make sure you are dropping it into AppIcon category. Similarly you need to do things for LaunchImage as well if you are interested.
AppICon Sizes - XCAssets - Xcode 6.4
iPhone Spotlight
iOS 5-6 - 29pt
29*29 -1x,
58*58 - 2x,
87*87- 3x
iPhone Spotlight
iOS 7,8- 40pt
80*80 - 2x,
120*120 - 3x
iPhone App
iOS 5,6 - 57pt
57*57 - 1x,
114*114 - 2x
iPhone App
iOS 7,8 - 60pt
120*120 - 1x,
180*180 - 2x
iPad Settings
iOS 5-8 - 29 pt
29*29 -1x,
58*58- 2x
iPad Spotlight
iOS 7,8 - 40pt
40*40 -1x,
80*80 - 2x
iPad Spotlight
iOS 5,6 - 50pt
50*50 -1x,
100*100 - 2x
iPad App
iOS 5,6 - 72pt
72*72 -1x,
144*144 - 2x
iPad App
iOS 7,8 - 76pt
76*76 -1x,
152*152 - 2x
I am about to launch a new app and would lik eto increase quality of the graphics. In my case the graphics is the logo and the custom buttons. I do not know if this impact Core Plot but that is also part of the package.
There is quite a few posts about this but there are still things i do not fully understand.
I am reading this quote from "amattn":
It's trivial:
1.Only include #2x images in your project.
2.Make sure those images have the #2x suffix.
The system will automatically downscale for non-retina devices.
The only exception is if you are doing manual, low level Core Graphics drawing.
You need to adjust the scale if so. 99.9% though, you don't have to worry about this.
From this post: Automatic resizing for 'non-retina' image versions
My question in regards to this is:
1. Should i do the testing on retina simulator only, as if i place a #2 grapic on
non-retina it will be too big? ...or is there an other way of doing it?
2. Should i always use a ImageView or is it OK to drag the image on the screen,
this is the logo i am talking about?
3. What about custom made buttons with images, how should i do with those?
4. What is the normal process to manage the different screen sizes, do people
add images for all displays or using this type of process?
Should i do the testing on retina simulator only, as if i place a #2 grapic on non-retina it will be too big? ...or is there an other
way of doing it?
It doesn't really matter which simulator you test on because as long as your non-retina and retina graphics are named correctly (image and image#2x) the correct image will be displayed automatically.
Should i always use a ImageView or is it OK to drag the image on the screen, this is the logo i am talking about?
When you drag and image from the project directly onto a view in interface builder you don't really see it happen but it has automatically created and image view which is containing the image your dropped in.
What about custom made buttons with images, how should i do with those?
[myButton setImage:[UIImage imageNamed:#"myFileName"]];
As shown in the above code you should always use the non-retina fle name when you reference the image a UI element should use. That was if iOS detects the device is retina it can automatically use the #2x version in its place.
What is the normal process to manage the different screen sizes, do people add images for all displays or using this type of process?
Yes, including multiple image resolutions common practice and is required for iPhone apps (not sure about iPad) to include both retina and non-retina images. But regardless of the requirements, you should definitely support both device resolutions to keep your customers happy!
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