CodeBuzzy Thumbnail – 4

How to add an image to the assets folder in Xcode | Beginner’s iOS Guide 2021

Whenever you create a project in Xcode, the assets folder is created by default. We can store images in this assets folder, to do so follow the steps below. Note that in Xcode 10, the Media Library has moved from the lower right-hand corner – to access the assets from a storyboard with Xcode 10, hit command + shift + m.

Step 1 :

Open your project in Xcode > Click Assets.xcassets in the project navigator to bring up the Asset Catalog for the project. The below image shows the list of images added to the assets folder.

Step 2 :

Click over the “+” button to the left bottom corner of assets. You will see a list of options, select New Image Set. This will create an empty image folder displaying dashed boxes of 1x, 2x, 3x (these are the different image sizes required).In the below image, you can see an empty folder named “Image” is created.

Step 3 :

If you want to rename the image name then select image name > Click Enter. The image name will be editable now. Replace it with a suitable name > Click Enter again. You can skip this step if you don’t want to rename the image. In the below image, the image named “Image” is renamed as “ic_hello“.

Step 4 :

Drag and drop the images in 1x, 2x, and 3x slots. You can generate iOS image sizes from this link. You can see the demo below: 

Using the image set in Interface Builder :

Any control that has images like UIImageViews or UIButtons can set images in Interface Builder. Any image set in the Asset Catalog will be listed in the image drop down menus.

Adding App Icon to Project

You can generate App icons on this link. Assets folder by default has a folder for App Icon. You simply need to drag and drop images, as mentioned in step 4 above.

Hopefully, we have covered everything you wanted to learn or do. If you find this blog helpful, do share it with your colleagues. Also if any issues while following the above steps to comment and let me know.

Leave a Comment

Rating*