57

Is it possible to add assets other than PNG files to an Xcode Asset Catalog?

When I drag JPEG files into an Asset Catalog they aren't accepted by the UI.

Charles
  • 50,943
  • 13
  • 104
  • 142
David Snabel-Caunt
  • 57,804
  • 13
  • 114
  • 132

6 Answers6

46

You can add non-PNG assets by editing the JSON representation of the asset manually. The easiest way is to copy an existing asset and modify it:

  1. Right click on an existing asset and choose Show in Finder
  2. Copy and paste the existing .imageset item and rename it, e.g. my_image.imageset
  3. Double-click the new .imageset
  4. Delete any existing images in the folder
  5. Copy in your JPEG files
  6. Edit the Contents.json file, replacing the values for the filename key with your JPEG filenames

Your Contents.json will look something like this:

{
  "images" : [
    {
      "idiom" : "universal",
      "scale" : "1x",
      "filename" : "my_image.jpg"
    },
    {
      "idiom" : "universal",
      "scale" : "2x",
      "filename" : "my_image@2x.jpg"
    }
  ],
  "info" : {
    "version" : 1,
    "author" : "xcode"
  }
}

Be sure to refer to your image by name, without extension:

[UIImage imageNamed:@"my_image"]

This approach will work for GIFs and other assets as they are just copied into the App's main bundle at build time. It is worth noting that the images end up with a png extension when copied to the bundle, but they still load correctly.

David Snabel-Caunt
  • 57,804
  • 13
  • 114
  • 132
  • 2
    It's worth nothing that the resulted images ARE pngs ;) That is, if one was willing to reduce the space taken (by using a JPEG instead of PNG), it's not working with Asset Catalog — or I haven't found the way yet :) – StuFF mc Nov 07 '13 at 14:35
  • 2
    Mine have the extension PNG, but aren't actually PNGs and don't increase in size. `identify test.png` shows `test.png JPEG 320x838 320x838+0+0 8-bit sRGB 10.4KB 0.000u 0:00.000` I do have 'Compress PNG Files' set to NO in my project settings. – David Snabel-Caunt Nov 07 '13 at 15:08
  • is it possible to have an animated gif? (sorry, I'm asking as you mentioned about GIFs) – Julian Jun 27 '14 at 10:04
  • 4
    This sounds like an ugly and fragile hack. – Nikolai Ruhe Aug 25 '14 at 09:07
  • 7
    Seems like it works for iOS 8, but not for iOS 7, 'Render As' set to 'Original Image' doesn't help either :( – Pavel Alexeev Feb 05 '15 at 13:33
  • This approach is correct. However imageNamed: without ".jpg" extensions will only load JPGs if minimum deployment target is iOS 8 or later. I have recently discovered this myself and you can read more in my answer here http://stackoverflow.com/questions/33250182/app-thinning-without-3x-images/33268074#33268074 – Andriy Gordiychuk Oct 21 '15 at 19:57
33

As of Xcode 6.1 JPG images can now be added to an asset catalog. The steps to add are:

  1. Export your JPG at the desired quality using the same naming conventions as for PNGs (i.e. heart.jpg heart@2x.jpg heart@3x.jpg)
  2. Drag the JPGs into your asset catalogue from Finder and add any splicing or device specific settings to the asset
  3. Change the 'Render As' to be 'Original Image' for all JPGs (otherwise they'll appear blank in the simulator and on the device)
Kevin Sylvestre
  • 37,288
  • 33
  • 152
  • 232
  • 2
    Step 3 change render as to 'original image' did the trick for me. Until I made that change the images would not display in the simulator or on the device. Anyone looking for that option - it's listed along side the name, devices, width and height etc in xcode. – Paul Sturgess Jan 06 '15 at 11:09
  • Would the exported IPA contain JPG or PNG? I'm seeing it contain PNG even if I add a jpg with the original image option. – rounak Jan 15 '19 at 21:51
11

It appears you can now drag and drop JPEGs in Xcode 6.0 Beta

onbek
  • 161
  • 1
  • 7
  • 4
    Thanks for this @onbek - bit ridiculous that we haven't been able to include jpegs up til now – amergin Jun 30 '14 at 11:15
  • 2
    Unfortunately this feature is not present in the official Xcode 6.1. I can't import jpg's into the assets, and if I force it into the asset, the image turns up blank in the simulator. – hlynbech Oct 23 '14 at 20:48
  • 1
    @hylnbech I had the same problem. Try changing the 'Render As' in the inspector to 'Original Image'. See my answer for some more details – Kevin Sylvestre Oct 30 '14 at 21:22
  • As a note this feature seems to be broken as of Xcode 7.0. All images with .jpg extensions that previously worked in Xcode 6 now do not load with '[UIImage imageNamed:]'. – user3847320 Sep 18 '15 at 19:45
4

In Xcode 6.x you can drag and drop jpegs to the asset catalog. If creating a UIImage from the asset make sure you use the .jpg extension like so:

[UIImage imageNamed:@"myimage.jpg"];

If the extension is not included, the image will just appear white/blank.

gavdotnet
  • 2,214
  • 1
  • 20
  • 30
1

You can also rename your image.jpg to image.png if you don't want to change the Contents.json file. You can then add the images to the asset catalog, even though internally they are still jpeg files. You can even slice them using Xcode.

When the application is compiled, all assets go into the Assets.car file. I haven't verified if at this point they get converted to png.

Carlos Parada
  • 21
  • 3
0

Try this. Quickly import resource scripts to resolve import speed and rename issues. https://github.com/qdvictory/happyxcasset

Seamus
  • 243
  • 1
  • 12