I started a new project in Xcode 5.
What is this Images.xcassets shenanigans?
Am I supposed to put the various images I'm using for my app (like button images & stuff) in there or only the AppIcon & LaunchImage?
I see I can create a new folder in Images.xcassets. Should I create a folder called "Button Icons" or whatever and just throw them in there?
See, but I just want to add some retina images to my target.
I'm only supporting iOS 7. So, I don't need to worry about other formats like non-retina.
Why did they make this so complicated and not document it at all? Why do I need these extra Contents.json files?
It looks like I can uncheck (remove) Images.xcassets from the target but not the individual image files within the asset catalog.
Can I just do things the old way or would I be missing out on compression/performance enhancements?
Is there a setting I can set so that my app treats all image files as retina images even if they dont have the #2x suffix in their filename?
In the "What's New in Xcode 5" WWDC 2013 Session Video, the speaker says Image.xcassets "collects all of your image-based resources, such as your launch images, icons, loose images that you use in your project, together into one place."
"Also, Xcode knows about new iOS 7 APIs and so can even optimize the loading of your image-based resources." I'm assuming "it does it for you automatically" as long as you put your images in Image.xcassets (or another asset catalog included in your target).
So, I suggest you suck it up, and adapt or die.
I don't know.
There are not retina devices that are still supported by iOS 7 such as iPad mini and iPhone 3GS. Keep that in mind. The images will scale down and still work but I wanted to make sure you knew iOS 7 supported not retina devices.
When you ask for an image by name iOS will look for the image by name. For example, "background.png" if there is a retina image "background#2x.png" and the device is retina iOS will handle that for you. If you only plan on providing retina images there is nothing wrong with making the images all retina and excluding the "#2x" info in the image. name.
Related
When I import an image, it gets placed in "Universal". Is there a way to tell xCode directly that that image is designed for iPad at #2x, and that image is designed for iPhone at #3x, and put those 2 together if they have the same name? Now I need to add everything manually, which takes a long time...
Thanks.
Edit: further detail (cause I probably misread your question a little)...
Xcode should already be doing that for you... I just tried it:
cat#2x.png
cat#3x.png
cat#2x~ipad.png
Select all three, drag and drop them into Assets in Xcode, and I automatically have a resource named "cat" with both 2x and 3x iPhone versions and a 2x iPad version.
So I was snooping around in that achieve trying to make my app smaller. And I found something odd!
There are two identical copies of every image! One with an ending "~iPad" and one with "~iPad#2x"
I understand the purpose of having those two endings, but when I am setting up the .xcassets the way I am.... I don't expect the app to need it. Is there any way to get rid of the duplicate?
Here is how I have set up one of my entires:
You should use universal image asset instead of separate for iphone and ipad.
from assets select this image set and from attribute inspector uncheck iphone and ipad under Device and check universal from it.
So you will get universal imageset with 1x,2x and 3x will automatically used by iphone and ipad both.
If you are using different size of images for iphone and ipad then you must set separate images for iphone and ipad but if you are using same image size then you should use universal as i mentioned above.
Hope this will help :)
With-in a clean brand new iOS project I've:
added 2 images to the project "background#2x.png" and "background#3x.png"
added a XIB named "LaunchScreen.xib"
checked the XIB's "Use as Launch Screen" option
added a UIView sub-view to LaunchScreen.xib and set its image name to "background.png"
with-in the project settings, under the targets 'General' settings I've set the 'Launch Screen file' to "LaunchScreen"
Now when I launch the app on any of the devices list below the #3x image is displayed in the resulting launch screen when surely the #2x image should be used.
Problem devices (that all use the #3x resource):
iPhone 5 (iOS 8.0.0)
iPhone 6 (iOS 8.0.0)
iPhone 6 (iOS 8.0.2)
iPhone 5 Simulator (iOS 8.0.0)
iPhone 6 Simulator (iOS 8.0.0)
NOTE that the #2x image is distinctive from the #3x image so I can easily identify which one is being used.
At first I assumed this was a bug with the simulator and was staggered when it occurred on a real device also.
I assume this is yet another iOS8 bug however I guess there's also the possibility that its expected behaviour as the result of the launch screen being cached as a static image of some kind.
Any ideas or potential solutions?
EDIT:
For the benefit of others, I have subsequently found that if the images are instead added to an Images.xcassets image set then the correct behaviour is in-fact observed. HOWEVER this is not an ideal solution for us since we have a very specific image export process which means we are not using an Images.xcassets in out project (there are thousands of images in the app).
I have now also raised a Radar with Apple #18513968
http://openradar.appspot.com/18513968
I've just tried this myself, and get the same behaviour you have mentioned.
By setting the Launch Images Source to "Use Asset Catalog", and adding the Launch Image you can get each device to show its specific background. Some screenshots can be seen here:
Supporting iPhone 6 and iPhone 6+ with different launch/splash screen image for iPad Portrait and Landscape orientations
Looking into it a bit more, I found a website that mention:
http://oleb.net/blog/2014/08/replacing-launch-images-with-storyboards/
"You can use the new adaptive UI features in Interface Builder to fit your layout to different screen sizes. If your scene requires screen-size-specific images, use asset catalogs to define different images per size class."
Maybe that is the only way to do it.
After switching to XCode5 I've just re-done all my icons and launch images for an app, with the exception of retina launch images I should have a complete set for both iPad and iPhone, iOS6 and iOS7, thanks to this tool: http://www.appiconsizes.com/
But XCode5 absolutely refuses to use them all. I removed all the old images from my project and added the new ones. Some, XCode automatically detects, seemingly at random. Many others, it says it can't find the images needed even though they are named according to Apple's guidelines (as far as I can see, it's all a bit confusing with so many variants). It lets me find them manually but doesn't seem to be using them properly.
And my launch images, it insists on using images from a different target even though these are definitely not marked to be included in this target. It won't even let me change those ones, if I try to then it just ignores my selection.
A few screenshots follow. I originally had just an "Icon" icon identifier in my plist, since Apple say it will automatically detect different variants, but XCode has then added Icon-76 and Icon-120, seemingly contradicting this. I'm aware XCode5 supports controlling things more through your plist than XCode4, but shouldn't require that - you should be able to tell it the icon base name or use "default" and it would figure things out?
Use an asset catalog for your project.
It has placeholders for the launch image and the icon and each one tells you which size it needs.
Much easier than handling lots of dirrefent files in different locations.
In the project info page there is a button that says "use asset catalog". It will import all your images for you. The code doesn't change when using an asset catalog so it will all still work.
Another thing with asset catalog is that the name of the files doesn't matter. You just drag the image to the slot you want it to go into. With icons and stuff there is only a size restriction.
Even for retina images you don't need the #2x before because there is now a slot for "standard" and "retina" images.
I guess the problem is in Your icon Name,
for iPhone retina Name should be Icon-60.png , Icon-60#2x.png
So as Fogmeister suggested use asset catalog
Like
So its like
In my application, I am having trouble showing iPad Retina images. I know I have to use the #2x~ipad.png extension in order to get them to properly show and I do that. My images are named according so they are all named the same besides the extension for each device. However, my images appear blurry when viewing them on an iPad 3. I know the images are the proper size and PPI but it just doesn't look clear.
My images are in my 'Copy Bundle Resources' too. I have tried to clean my project, and restart Xcode. No luck.
Also in Interace Builder in my iPad XIB, I have each image set to the -72.png image (I guess the image automatically switches to the #2x~ipad.png if it is an iPad 3 correct?)
Is there any way to confirm maybe via NSLogs to see if it is loading the correct images? Also is there anything else I should double check to ensure that the proper images are loaded.
Uh, if you really are doing this:
[name]-72.png and [name]#2x~ipad.png
thats not right.
If this is a universal app, then you have
Foo.png (or Foo~iphone.png) and Foo#2x.png (or Foo#2x~iphone.png) [NOTE: iphone not iPhone];
Foo~ipad.png and Foo#2x~ipad.png
This all working for me in my universal app.
EDIT: you can read about the naming convention in Apple's "Resource Programming Guide", page 46:
The bundle- and image-loading routines automatically look for image
files with the #2x string when the underlying device has a
high-resolution screen. If you combine the #2x string with other
modifiers, the #2x string should come before any device modifiers but
after all other modifiers, such as launch orientation or URL scheme
modifiers. For example:
MyImage.png - Default version of an image
resource.
MyImage#2x.png - High-resolution version of an image
resource for devices with Retina displays.
MyImage~iphone.png -
Version of an image for iPhone and iPod touch.
MyImage#2x~iphone.png -
High-resolution version of an image for iPhone and iPod touch devices
with Retina displays.
EDIT2: So I did trip on a reference to "-72" (and -50). These were used in iOS 3.1.3 and older. The full explanation is found "iOS Application Programming Guide", "App Icon" section (links too fragile to use).
What I am doing is setting the image names to:
[name]_ipad.png, [name]_ipad#2x.png. [iPad]
[name]_ipod.png, [name]_ipod#2x.png. [iPhone]
And, I added a category on UIImage, mc_imageNamed: that appends the _ipad or _ipod based on the current device. And of course I have set the images based on their names in the XIBs.
This method is guaranteed to work, from my experience. It would be great if someone would fix your issue, but this solution is also available.