How to use an image within a storyboard in XCode

Add the image to the project and in a storyboard, add a UIImageView to a view and apply the image using the attributes inspector on the right menu sidebar.

<p>A flower that represents Xcode with the text "Add an Image to a Storyboard" beneath it.</p>

Subscribe Download open source project

Step One: Add the Images

<p>A screenshot showing a finder window next to an XCode project. We have highlighted how you can drag and drop assets from the finder window into Xcode.</p>

Add the image files directly to the project or to the projects xcassets.

How to add and use images as files instead of xcassets in XCode How to add and structure local images in Swift

Step Two: Add the UIImageView to the Storyboard

<p>A screenshot of Xcode showing a launch screen storyboard file with an empty image view. This demonstrates that we successfully added an image view to the launch screen.</p>

In a Storyboard within your project, add a UIImageView to a view.

How to add a UI component to a view in a storyboard in XCode

Step Three: Apply the Image

<p>A screenshot of Xcode showing the launch screen storyboard. We have added a UIImageView to the viewcontroller and we have highlighted that it is selected. On the right menu sidebar, we have highlighted the icon that indicates that the attributes inspector is active as well as the "image" dropdown that allows you to select the image to apply to the image view.</p>

Select the Image View and open the attributes inspector on the right menu side bar.

Under Image either type in the name of the image in the input or use the dropdown to select an image from the project.

<p>A screenshot of Xcode showing the launch screen storyboard. An image has been applied to the UIImageView.</p>

Any Questions?

We are actively looking for feedback on how to improve this resource. Please send us a note to inquiries@delasign.com with any thoughts or feedback you may have.

Subscribe Contact Us Visit our Blog View our Services View our Work