I have some image resources, such as toolbar-1#2x.png toolbar-2#2x.png toolbar-1#3x.png toolbar-2#3x.png, I find that the 3x images can't autosize for iPhone 6/6plus, how can I set the 3x size images for iPhone 6/6plus? thanks.
Just drag your images to your xcassets file in your project. Xcode handles all the sizing stuff.
Not really directly relevant but as a known issue, you cannot use jpg files in your xcassets file on iOS7.
I hope you know what is Images.xcassets , you should use asset catalog for adding all your 1x,2x and 3x images.
As per apple doc:-
An asset catalog can include:
Image sets: Used for most types of images, an image set contains all the versions, or representations, of an image that are necessary
to support various devices and scale factors.
App icons: App icon sets contain all the representations of the icon that iOS apps must provide to be displayed on a device’s Home
screen and in the App Store.
Launch images: Launch image sets contain all the representations of the static launch image that iOS apps must provide to be
temporarily displayed when the app is launched.
Related
Per default Apple only seems to allow #3x, #2x and #1x as suffixes for images and app thinning.
#3x resources seem to be reserved for iPhone 6/7 Plus, even though their screen resolution is smaller than the resolution of the largest iPad Pro - which seems to use #2x.
Is there any way to specifically have 5 different folders with data and use one folder per actual device resolution that is out there? Those folders would be for example (and any new or in-between resolution would use the closest folder and scale):
568p
1136p
1334p
2048p
2732p
Is that possible somehow?
In the Assets in your Xcode project you can click on the + and add a new image set. There you can right click and add iPhone and iPad individually.
I've started developing an iOS app, adding pictures in resolution which is ok for standard retina screens. Now I want to add #3x pictures for iphone 6 plus and 7 plus. I don't want to include 1x version for older devices. I've renamed all image files to name#2x but these are not recognized in the project anymore. I was thinking that #2x name modifier will be ignored, but this is not the case. Do I need to explicitely add "#2x" in all places I'm referencing these pictures in the code? Or should I leave standard retina versions without any name change and these will be used anyway as #2x and only use #3x name modifier for higher resolution versions?
Use asset catalogs. See Apple Documentation
Then it's really easy to define 1x, 2x and 3x images by drag&drop. If you load the image in code by name (without scale) it works like a charm. If 1x is missing the next possible image will be used automatically.
You can import pdf-images or well known as vector-images as single vector in assets.Hence No need of 1x,2x,3x seperatly.
You can use Blade
Better asset workflow for iOS developers. Generate Xcode image catalogs for iOS / OSX app icons, universal images, and more.
with a definition file like this will generate all the images for you and put it in the right place
blades:
- source: store/slice1.png # this image should be the only image, and the biggest image you can use (typically for icons, 1024x1024)
mount: Project/Assets.xcassets/AppIcon.appiconset
I am using Universal for Assets.xcassets in the hopes that I only have to create 3 different sizes for each image I use. But, despite Assets.xcassets telling me that my images are Universal in the Attributes Inspector, when I test on my iPad, the images are blurry and aren't as sharp as they are on my iPhone, making me question why there is a Universal option.
I've double checked all my images and they are all correctly sized.
My questions:
In the Attributes Inspector, under Universal, there are iPhone and iPad options. In order for my iPad to provide crystal clear images, should I use the iPad option?
And if I should: What's the point of the Universal option if it doesn't really do its job?
Also if I should: What size images do I use. The iPad option gives me the options of 1x and 2x size images. So, should the size of the 1x image for iPad be the same size as 1x image for Universal?
Thanks in advance.
Universal merely means that this app will run on iPad and iPhone natively. Thus the devices on which your app might run can have a single-resolution, double-resolution, or triple-resolution screen.
If you have checked Universal, accordingly, you should see three slots:
Your job, therefore, is to make three versions of your image, sized in proportion. If the 1x is 100x100, the 2x should be 200x200 and the 3x should be 300x300. The version in the appropriate slot will be used at runtime in accordance with the screen resolution of the device we're running on.
The asset catalog does not do any image sizing for you. You have to do it beforehand. (I find Graphic Converter a nice utility for this purpose.)
You could just supply a 3x image and allow the runtime to size down for you, but this is a waste of memory; Apple specifically advises against this in one of the WWDC 2016 videos. So just bite the bullet and make all three image sizes yourself.
Finally:
when I test on my iPad, the images are blurry and aren't as sharp as they are on my iPhone
Hmm, the only reason I can think of for this is that your app is not running natively on the iPad, but is an iPhone app running in "emulation mode" on the iPad. If that's the case, nothing you can do is going to make it look really good. It would be better to write your app as a true Universal app. That is a setting that you make when you create the project initially (though it can be changed later by editing the app target).
In iOS I'm developing a game(Universal), So at the runtime images are available on server and I'm going to download them. So what I should do?
I can download any image #1x, #2x and #3x. But in this case my every image going to have 2 versions so it will take too much space on server.
or
Should I keep #3x image only on server and I resize it to #1x or #2x according to device scale.
Which should be preferred.Thanks.
Now apple introduced new concept of app-thinning. You don't have to worry about putting multiple images inside bundle. You add all images 1x, 2x and 3x within the application assets. Based on device type App Store will provide images required to run on the application.
For an upcoming update to one of my apps I have packed all the image resources into Asset Catalogs.
However, at the moment I do not have #3x version for most of my images. I have checked with the simulator and on iPhone 6 Plus #2x versions are used.
I don't mind this behaviour for two reasons:
The result is good enough for images which I am using
Only 50% of my users are using iOS 9. If I add #3x images the size of my app will skyrocket for those on older OS
Although images load correctly in the Simulator for iPhone 6 plus, I am a bit worried about what happens when I archive my app. In particular, I am afraid that with App Thinning iPhone 6 Plus users will get an app without any images :)
So, I have two questions:
If I do not provide #3x images will #2x be loaded on iPhone 6 plus
after my update goes live on the App Store?
Will I still benefit from App Thinning because users with #2x and
#3x displays will not be downloading #1x images (and vice versa)? Or will App Thinning not work in this case and users will get the same assets irrespective of their device's screen?
These are trivial questions, but I couldn't find info anywhere online as to what happens when you do not follow Apple's guidelines by not providing #3x images in asset catalogs but your app is still available for iPhone 6 +. In addition, some of my images are in JPG format which adds extra uncertainty because it is not an ideal format for iPhone.
Thanks in advance for any assistance!
I performed several additional tests using the procedure proposed by Matt:
When minimum deployment target is iOS 6 no Assets.car is being
generated. [UIImage imageNamed:] returns nil for JPG images unless ".jpg" extensions is provided as part of the image name
When minimum deployment target is iOS 7 Assets.car is generated but
it contains only those images which were imported in Asset Catalog
as PNGs. All JPGs get copied outside of Assets.car. [UIImage imageNamed:] returns nil for JPG images unless ".jpg" extensions is provided as part of the image name.
When minimum deployment target is iOS 8 Assets.car contains all
images. Its size is 13MB. [UIImage imageNamed:] returns JPG images correctly even when not specifying ".jpg" extension. Images also load correctly when ".jpg" extension is included
When minimum deployment target is iOS 9 Assets.car contains all
images. Its size is 11.5MB. [UIImage imageNamed:] returns JPG images correctly even when not specifying ".jpg" extension. Images also load correctly when ".jpg" extension is included
I have used the image extractor tool suggested by Matt to extract images from these Assets. I was only able to export from archives for devices which are with Retina and I can confirm that all images had correct resolutions (i.e. only retina size, iPad specific images ignored). The tool, however, saved all of them in PNGs format and so the resulting size of the folder was always bigger then Assets.car.
What is most surprising is that the size of the folder was the same (39.4MB) for cases 3 and 4. Also, the images seem to be exactly the same. So, I really wonder what happens there because there is a difference of 2MB in the size of Assets.car for these cases.
To conclude, we are still not sure if such testing method can be used to accurately mimic the App Thinning behaviour. So, if anyone had a personal experience with this it would be awesome if they could share it.
However, assuming that exporting for specific device for AdHoc produces the same result as actual App Thinning performed by App Store we can conclude that:
App thinning only kicks in when deployment target is iOS 7 or later
App thinning for JPG images only works starting from a minimum deployment target of iOS 8
[UIImage imageNamed:] returns JPG images correctly without providing ".jpg" extension only when JPG images are correctly processed through Asset Catalogs. Which, as mentioned earlier, only happens when minimum deployment target is iOS 8 or later
[UIImage imageNamed:] always loads correct images if ".jpg" extensions is specified.
The last two conclusions seem to be irrelevant to this question, but I have found several conflicting opinions on Stack Overflow about how to load JPG images correctly with Asset Catalogs. Some people claimed that you can load them without providing ".jpg" extension whilst others complained that this approach doesn't work. I think 3 and 4 above explain in details what is happening in this case and why people get different results.
Answer your own question. Archive the app. Export the app for the target device you're interested in:
Now look inside the exported app and see what resources it contains. An .ipa is just a .zip file by another name; it's easy to look inside it by changing the suffix. Now you know what resources an iPhone 6 Plus user will download from the App Store.
After getting iPhone4s and iPhone 6SPlus archive, from a project with missing 3x images
then using the image extractor tool suggested by Matt,
deployment target iOS 7
here's the result: