UIImageView
UIImageView is a container for displaying a single image or a series of images.
Example
Instructions
Create
- Open Xcode
- Click File
- Click New
- Click Project...
- Under iOS, click Application
- Click Single View Application
- Click Next
- After Product Name, type your product name
- After Organization Name, type your organization name or leave blank
- After Organization Identifier, type your organization identifier
- After Language, select Swift
- After Devices, select Universal
- Uncheck Use Core Data
- Click Next
- Select a folder
- After Source Control, uncheck Create Git repository on
- Click Create
Edit ViewController.swift
- Open ViewController.swift
- Copy and paste code
Edit Main.storyboard
- Open Main.storyboard
- Click View
- Click Utilities
- Click Show Object Library
- Drag Image View to View
- Click View
- Click Utilities
- Click Show Connections Inspector
- Under Referencing Outlets, after New Referencing Outlet, drag + to View Controller
- Click interfaceBuilderImageView
Add Images
- Click File
- Click Add Files to "UIImageView" ...
- Select images
- After Destination, check Copy items if needed
- After Added folders, select Create groups
- After Add to targets, check UIImageView
- Click Add
Run
- Click Product
- Click Run
Code
import UIKit class ViewController: UIViewController { @IBOutlet weak var interfaceBuilderImageView: UIImageView! override func prefersStatusBarHidden() -> Bool { return true } override func viewDidLoad() { super.viewDidLoad() let image1 = UIImage(named: "HappyFace1")! let image2 = UIImage(named: "HappyFace2")! let image3 = UIImage(named: "HappyFace3")! let image4 = UIImage(named: "HappyFace4")! let image5 = UIImage(named: "HappyFace5")! let image6 = UIImage(named: "HappyFace6")! self.interfaceBuilderImageView.animationImages = [image3, image4] self.interfaceBuilderImageView.highlightedAnimationImages = [image5, image6] self.interfaceBuilderImageView.highlightedImage = image2 self.interfaceBuilderImageView.image = image1 self.view.removeConstraints(self.view.constraints()) let animateButton = UIButton.buttonWithType(UIButtonType.System) as UIButton animateButton.addTarget(self, action: "animateTouchUpInside:", forControlEvents: UIControlEvents.TouchUpInside) animateButton.setTitle("Animate", forState: UIControlState.Normal) animateButton.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(animateButton) self.view.addConstraint(NSLayoutConstraint(item: animateButton, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: self.interfaceBuilderImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let highlightButton = UIButton.buttonWithType(UIButtonType.System) as UIButton highlightButton.addTarget(self, action: "highlightTouchUpInside:", forControlEvents: UIControlEvents.TouchUpInside) highlightButton.setTitle("Highlight", forState: UIControlState.Normal) highlightButton.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(highlightButton) self.view.addConstraint(NSLayoutConstraint(item: highlightButton, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: animateButton, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let imageImageView = UIImageView() imageImageView.image = image1 imageImageView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(imageImageView) self.view.addConstraint(NSLayoutConstraint(item: imageImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: highlightButton, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let highlightedImageView = UIImageView() highlightedImageView.highlighted = true highlightedImageView.highlightedImage = image2 highlightedImageView.image = image1 highlightedImageView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(highlightedImageView) self.view.addConstraint(NSLayoutConstraint(item: highlightedImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: imageImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let tintColorImageView = UIImageView() tintColorImageView.image = image1.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate) tintColorImageView.setTranslatesAutoresizingMaskIntoConstraints(false) tintColorImageView.tintColor = UIColor.blackColor() self.view.addSubview(tintColorImageView) self.view.addConstraint(NSLayoutConstraint(item: tintColorImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: highlightedImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let animationImagesImageView = UIImageView() animationImagesImageView.animationImages = [image3, image4] animationImagesImageView.setTranslatesAutoresizingMaskIntoConstraints(false) animationImagesImageView.startAnimating() self.view.addSubview(animationImagesImageView) self.view.addConstraint(NSLayoutConstraint(item: animationImagesImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: tintColorImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let highlightedAnimationImagesImageView = UIImageView() highlightedAnimationImagesImageView.animationImages = [image3, image4] highlightedAnimationImagesImageView.highlighted = true highlightedAnimationImagesImageView.highlightedAnimationImages = [image5, image6] highlightedAnimationImagesImageView.setTranslatesAutoresizingMaskIntoConstraints(false) highlightedAnimationImagesImageView.startAnimating() self.view.addSubview(highlightedAnimationImagesImageView) self.view.addConstraint(NSLayoutConstraint(item: highlightedAnimationImagesImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: animationImagesImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let animationDurationImageView = UIImageView() animationDurationImageView.animationDuration = 10 animationDurationImageView.animationImages = [image3, image4] animationDurationImageView.setTranslatesAutoresizingMaskIntoConstraints(false) animationDurationImageView.startAnimating() self.view.addSubview(animationDurationImageView) self.view.addConstraint(NSLayoutConstraint(item: animationDurationImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: highlightedAnimationImagesImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let animationRepeatCountImageView = UIImageView() animationRepeatCountImageView.animationImages = [image3, image4] animationRepeatCountImageView.animationRepeatCount = 100 animationRepeatCountImageView.setTranslatesAutoresizingMaskIntoConstraints(false) animationRepeatCountImageView.startAnimating() self.view.addSubview(animationRepeatCountImageView) self.view.addConstraint(NSLayoutConstraint(item: animationRepeatCountImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: animationDurationImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) let contentModeScaleToFillImageView = UIImageView() contentModeScaleToFillImageView.contentMode = UIViewContentMode.ScaleToFill contentModeScaleToFillImageView.image = image1 contentModeScaleToFillImageView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(contentModeScaleToFillImageView) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleToFillImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: animationRepeatCountImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleToFillImageView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1/4, constant: 0)) let contentModeScaleAspectFitImageView = UIImageView() contentModeScaleAspectFitImageView.contentMode = UIViewContentMode.ScaleAspectFit contentModeScaleAspectFitImageView.image = image1 contentModeScaleAspectFitImageView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(contentModeScaleAspectFitImageView) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleAspectFitImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: animationRepeatCountImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleAspectFitImageView, attribute: NSLayoutAttribute.Left, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Right, multiplier: 1/4, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleAspectFitImageView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1/4, constant: 0)) let contentModeScaleAspectFillImageView = UIImageView() contentModeScaleAspectFillImageView.contentMode = UIViewContentMode.ScaleAspectFill contentModeScaleAspectFillImageView.image = image1 contentModeScaleAspectFillImageView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(contentModeScaleAspectFillImageView) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleAspectFillImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: animationRepeatCountImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleAspectFillImageView, attribute: NSLayoutAttribute.Left, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Right, multiplier: 2/4, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: contentModeScaleAspectFillImageView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1/4, constant: 0)) let clipsToBoundsImageView = UIImageView() clipsToBoundsImageView.clipsToBounds = true clipsToBoundsImageView.contentMode = UIViewContentMode.ScaleAspectFill clipsToBoundsImageView.image = image1 clipsToBoundsImageView.setTranslatesAutoresizingMaskIntoConstraints(false) self.view.addSubview(clipsToBoundsImageView) self.view.addConstraint(NSLayoutConstraint(item: clipsToBoundsImageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: animationRepeatCountImageView, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: clipsToBoundsImageView, attribute: NSLayoutAttribute.Left, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Right, multiplier: 3/4, constant: 0)) self.view.addConstraint(NSLayoutConstraint(item: clipsToBoundsImageView, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Width, multiplier: 1/4, constant: 0)) } func animateTouchUpInside(sender: UIButton!) { if (self.interfaceBuilderImageView.isAnimating()) { self.interfaceBuilderImageView.stopAnimating() } else { self.interfaceBuilderImageView.startAnimating() } } func highlightTouchUpInside(sender: UIButton!) { let animating = self.interfaceBuilderImageView.isAnimating() if (self.interfaceBuilderImageView.highlighted) { self.interfaceBuilderImageView.highlighted = false } else { self.interfaceBuilderImageView.highlighted = true } if (animating) { self.interfaceBuilderImageView.startAnimating() } } }