48 thoughts on “13. Adding and displaying images in your app”

  1. Hey Chris , I’m trying to add an image to a trivia app that im doing . I can’t seem to figure out how to implement the picture with the question together. Any suggestions?

    • Hey Robby, are you having trouble with constructing the layout? Since your question isn’t related to this lesson specifically, please feel free to use the contact link at the bottom of the site and I’ll see if i can help. Thanks!

      • Hi Chris, its card10 UI. swift automatically displays its ui as soon as i type in any card names. I think I have came to find the issue.

        I think that auto UI is causing a prob there coz, I ignored this tutorial and carried on with next one and out of blue, I came to delete/remove that auto UI and seems to be working absolutely fine. I completed all those card games tutorials.

        However, although swift automatically displays that UI there whenever I types in card name, it shouldn’t really cause a prob isn’t it?

        I’m assuming its more of swift version issue?

        But your advice would be helpful.

        I’m going through your YouTube tutorials now and try to grasp as much knowledge as possible before I’m ready to buy your package tutorials, which I can’t wait.

        thank you so much chris for your all lovely tutorial, its very organised and in depth.

        Sagar.

  2. I have this code but the images never show up:

    class ViewController: UIViewController {

    // ALL VARIABLES
    var secretNumber = 10
    var numberOfGuesses = 3
    var guessedNumber = 0

    @IBOutlet weak var theGoButton:UIButton?
    @IBOutlet weak var theGuessedNumberField:UITextField?
    @IBOutlet weak var prizeView:UIImageView!

    override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    }

    override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
    }

    @IBAction func startGame(sender:UIButton) {

    guessedNumber = Int(theGuessedNumberField!.text!)!
    print (secretNumber)
    print (guessedNumber)

    //ALL INSTRUCTIONS
    if (guessedNumber == secretNumber) {
    // this is the correct answer
    print(“Congratulations, you get a chocolate”)
    prizeView.image = UIImage(named:”snickers”)
    print (secretNumber)
    print (guessedNumber)
    resetTheGame()
    } else {
    //this is the incorrect answer
    if (0<numberOfGuesses) {
    print("Wrong!")
    numberOfGuesses -= 1
    } else {
    doTricks()
    }
    }
    }

    func doTricks(){
    print("You must eat a dead frog")
    prizeView.image = UIImage(named:"deadfrog")
    resetTheGame()
    }

    func resetTheGame() {
    numberOfGuesses = 3
    guessedNumber = 0
    secretNumber = Int(arc4random_uniform(10) + 1);
    print(secretNumber)
    //prizeView?.isHidden = true
    }

    }

    • Hello! I would just double check that you have an image in your asset library called “snickers” and also that prizeView is a UIImageView element that is visible on your screen!

  3. Hi Chris,

    First, I want to thank you for your very detailed tutorial videos. Everything works fine for me till now.

    However, in this 13 lesson, when I tried to type LeftCard.image = UIImage ( named: string), Xcode didn’t automatically give me any suggestion. At the end, I still can run the code perfectly. But I mean in your video, you don’t need to type the full code. You just type some keywords and Xcode is going to give you suggestions for the full codes. I think it’s really helpful to have that assistance. Could you please tell me what’s my problem?

    It only happens when I try to create this function: LeftCard.image = UIImage (named: string), the UIImage library doesn’t give me any suggestion. However, for other codes, it works. Xcode does give me suggestion when I type other codes other than the UI-Image’s code.

    Thank you in advance.

  4. I’m having a few problems with this tutorial. I have been following along using MacinCloud service remote desktop and the latest Xcode/swift version available there.

    First, that interface doesn’t allow me to control-drag directly from the view window to the viewcontroller code window (no blue line) but I can do that from the right click menu as explained later in the tutorial.

    Second, this version (I think its Xcode 8 Swift 3) doesn’t have a weak/strong option for IBOutlet connections. Not an option in the popup window (I think weak is default for UIImageView but weak doesn’t appear in the code and if I try to add it I get an error).

    Third, I am unable to attach an image to the UIImageView. I use the exact syntax you provided but I get an error saying image is not a member of UIImageView.

    When I reconnect via RDP I can post exact error messages and code or screen images if that would be helpful. Major roadblock now if I can’t attach images.

    • Code:

      ***************************************************************

      //
      // ViewController.swift
      // War
      //
      // Created by user123308 on 11/2/16.
      // Copyright © 2016 Evoqua. All rights reserved.
      //

      import UIKit

      class ViewController: UIViewController {

      @IBOutlet var rightImageView: [UIImageView]!
      @IBOutlet var leftImageView: [UIImageView]!
      @IBOutlet var leftScoreLabel: [UILabel]!
      @IBOutlet var rightScoreLabel: [UILabel]!

      override func viewDidLoad() {
      super.viewDidLoad()
      // Do any additional setup after loading the view, typically from a nib.
      }

      override func didReceiveMemoryWarning() {
      super.didReceiveMemoryWarning()
      // Dispose of any resources that can be recreated.
      }

      @IBAction func dealTapped(sender: UIButton) {
      print (“deal tapped”)

      leftImageView.image = UIImage(named: “card10”)
      rightImageView.image = UIImage(named: “jack”)
      }
      }

      ********************************************************
      Swift compiler error messages:

      /Users/user123308/Desktop/Tutorial xcode projects/War/War/ViewController.swift:31:9: Value of type ‘[UIImageView]’ has no member ‘image’
      /Users/user123308/Desktop/Tutorial xcode projects/War/War/ViewController.swift:32:9: Value of type ‘[UIImageView]’ has no member ‘image’

      • Apparently the right click method put square brakets around UIImageView and UILabel in the IBOutlet statements automatically, which was not desired.

        I took those out and that eliminated the compiler errors, but after build I code a code break at the first IBOutlet statement. I’m going to try deleting these and writing the lines first before attaching. It would be helpful if there were better instructions about how to do this if you are using MacinCloud and remote desktop, because it isn’t as simple without the ability to drag from the view into the code pane.

        • OK, got it working now. The code break was leftover from a breakpoint I inserted in a previous lesson. I didn’t realize it was still there or recall how to find and remove it until the break during execution forced me to look for it.

  5. Thought I had everything working but now getting this error:
    @UIApplicationMain
    class AppDelegate: UIResponder, UIApplicationDelegate { thread 1 breakpoint 3.1

    and in the debug area I get: unrecognized selector sent to instance

    Any ideas?

    • Hey Kelly this “unrecognized selector” error usually happens when you’re trying to call a method on nil.
      My guess is that you’re calling a method on an IBOutlet property but that property isn’t actually connected to an element on the storyboard (or connected to the wrong type of element). Right click each element on your storyboard to double check!

  6. Hi Chris. Loving the videos! Quick question. When you find an image on line for example, how do you save it in the various 1X, 2X, 3X formats easily?

  7. Hi Chris, Thanks for your video 😉
    How can i get the logo and button image file? i did download card images but it just only card,back,background images…

  8. I’ve made it to war.4..
    Still the same outcome. This time “Deal Button” is also missing when run the app. Checked and rechecked several times. No errors no warnings in the code. Everything is by the book ( Chris tutorial ).
    WHY this outcome ? Any help ??

  9. Hi Chris. I have a bad result when I hit the “Play” button. The cards are disappearing and all I see is the background. When I run it again I can see the back of the cards and afterwards only background.
    I double checked everything (for two hours) and looks I respected all the rules. The only difference is I used a different set of cards downloaded from the internet . Png also.
    What can be the problem ???
    It is frustrating……

  10. Hello Chris! This was a wonderful tutorial! I’m having trouble with the playRoundButton.setTitle I keep getting an error message saying “UIImageView does not have a member name’setTitle'” can you help? I know that this is part of the earlier tutorials but i just found this video first.

    • Never mind i found the problem. I made the var playRoundButton a UIImageView instead of a UIButton. But now i get a fatal error code. Please help.

  11. Hello! I am in a bit of trouble.
    I ran into the same problem as Ronja and Ryan, but I can`t solve it. Before “linking” the ImageView into the code, the emulator shows everthing just fine.
    After i link them, I can only see the background.
    Please help.

  12. Hi Chris, can you help me with an issue? I’m having an error message pop up that says “UIView does not have a member named image.” This is around the 13:40 mark in your video. Thanks.

    • Hello! That means that what you think is a UIImageView is actually a UIView instead!
      Several things may have happened:
      1. You might have dragged a UIView element onto your storyboard instead of a UIImageView element.
      2. When hooking up the IBOutlet property, you may have connected a UIView instead of a UIImageView element.

      To fix this, just delete the property (remember the name of the property) and go into your storyboard..
      then right click (or cmd+click) each element to find the one that you erroneously connected. You’ll know because it’ll say that the referencing outlet is connected to that property name that you just deleted. Once you find it, just click the “x” beside the connection to break the connection to the property that you deleted.

      Now you’re back at square 1. Double check that you have a UIImageView element in your storyboard and then connect THAT one as an IBOutlet.

  13. ========== never mind 🙂 ============= i’ve managed to muddle through it and finish the deck i need.

    i need help with the images please. what resolution did you use? you have your @3x files at 120×170. i used idraw to break apart the svg file of the cards, and i’m just wondering what settings to export them at. my first attempts produced TINY images via Prepo 🙁 i want to use a 52 card deck so if anyone could help/advise i’d appreciate it 🙂

  14. OK – I had it working – it flipped Card1 – then I decided to change the name of my IBAction func so I broke the reference in the correct way and then added it back – now it builds properly but when I hit the button – the whole thing crashes – also when I look at my reference list for my button – it only shows the IBOutlet reference – not the action reference – I keep deleted and re-doing it but still not working

  15. Ok I have a problem and I am freaking out

    After I add my images in, and I click mainstoryboard to add the images to the cards, my mainstoryboard is BLANK. Like white…and I clicked the View Controller Scene to look at where my button and UI card images went, and they are listed their with their constraints, but they are in a grey faded color, and I am guessing that indicates that they are there but I cannot see them on my storyboard because they are disabled or something. What should I do? How can I get the images back on my main storyboard?

  16. Hi Chris!!!

    Loving the tutorial so far. However, I have run into my first problem and can’t seem to figure out what’s happening. On my main.storyboard it shows the images of the background, card backs, and even each card if I choose so. When I run the app, I get a debug error:

    Could not load the “background” image referenced from a nib in the bundle with identifier “com.spennyco.War”

    And then the same error for the card back.

    Tried lots but can’t seem to figure it out!!

    Spenny

      • Hi Chris!

        I have done that, and there definitely is…I have even gone as far as to re-do the entire tutorial and I am still having the same issue!

        I have a feeling it has to do with system permissions with xCode. I can’t remove files from xcode, the only way I can is to go to “show in finder” and delete in the Finder.

        Its quite strange! Have you seen this before?

        Spenny

        • Hey Spencer, no i haven’t seen that before unfortunately! Maybe you can let me run the project and give it a try?
          You can contact me with the “Contact” link at the top of the site and I’ll email you back requesting your project!

Leave a Comment