MatchApp Lesson 9 flipUp Not Working

the cards do not flip when clicked on. I even put print statements everywhere and the code is never getting inside the “didSelectItemAt” section. I feel like I missed a crucial step somewhere but I have no idea how to find it.

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        print("INSIDE COLELCTIONVIEW METHOD")
        //Get a reference to a cell that was tapped
        let cell = collectionView.cellForItem(at: indexPath) as? CardCollectionViewCell
        
        //Flip the card
        //TODO: This doesnt work :(
        print("BEFORE FLIPUP")
        cell?.flipUp()
        print("AFTER FLIPUP")
    }

flipUp Method:

func flipUp() {
        //Flip up anomation
        print("INSIDE FLIPUP METHOD")
        UIView.transition(from: backImageView, to: frontImageView, duration: 0.3, options: [.transitionFlipFromLeft, .showHideTransitionViews], completion: nil)
    }

Have you set the collectionView.delegate = self and collectionView.dataSource = self in viewDidLoad() ?

1 Like

Yes I definitely did that

can you share all your code?

I’m new myself so take my suggestions with a grain of salt. You may already be surmising this, but I’m betting that your cell constant is nil, so put in an if statement to test that theory. So the big question is why is it nil.

when looking at the story board for your CardCell - make sure you used the exact same name with right capitalization in your code and it’s reuse identifier. Also make sure that you have the CardCollectionViewCell entered as a custom class and that below that, there is a field below that which needs to be populated with the name of your project itself. I would bet this is your problem.

The problem is that it is not even calling the third collectionView function. I also checked everything that you said and it all checks out. Below is my entire ViewController file, hopefully someone can spot the issue.

import UIKit

class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate {
    
    @IBOutlet weak var collectionView: UICollectionView!
    
    let model = CardModel()
    var cardsArray = [Card]()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        cardsArray = model.getCards()
        
        //Set the view controller as the datasource and delagate of the collection view
        collectionView.dataSource = self
        collectionView.delegate = self
    }
    
    //MARK: - Collection View Delagate Methods
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        //return number of cards
        return cardsArray.count
    }
    
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        //Get a cell
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CardCell", for: indexPath) as! CardCollectionViewCell
        
        //TODO: Configure it
        cell.configureCell(card: cardsArray[indexPath.row])
        print("CELL CONFIGURED")
        

        //Return it
        return cell
    }
    
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        print("INSIDE COLELCTIONVIEW METHOD")
        //Get a reference to a cell that was tapped
        let cell = collectionView.cellForItem(at: indexPath) as? CardCollectionViewCell
        
        //Flip the card
        //TODO: This doesnt work :(
        print("BEFORE FLIPUP")
        cell?.flipUp()
        print("AFTER FLIPUP")
    }
}

Hey Jimmy,

You VC code looks OK at a glance so it’s likely another issue.

If you like, I can take a look at your project on my machine and see if I can spot the problem. If that’s an option you want to take up then compress your project (create a zip file) at the root level and upload it to Dropbox (or Google Drive if you prefer) and share a link with me in a reply here or private message me with the link.

If DropBox and Google Drive are not an option then private message me and we can work something out.

Hi Chris, I’m facing the same issue. I have put my project in google drive. Here is the link. Appreciate your help. Thanks.

ht

@weehoo76

Access to that project on Google Drive is denied. Make it available without having to request access.

Sorry. Please try again.

(Link removed by Moderator)

@weehoo76
What you posted then was just an Amazon Prime shipping notice. I’m sure that was not what you intended to share. I have edited the post and removed that link since it is likely private information.

What you need to do is compress the project at the root level and create an archive (ZIP file) and then share that on Google Drive or DropBox, whichever is more convenient.

I"m sorry. Trying again. This time, I’ve verified it’s the correct file.

https://drive.google.com/file/d/1qXCfV0p_kOPsJrlJ6GF5QdiC2fnRsmn-/view?usp=sharing

OK Cheers @weehoo76

I have your project so I will take a look and see what the problem might be.

Thanks Chris. I’ve modified a bit from the lesson, like reducing the cards as part of troubleshooting.

Yes, I noticed that.

The issue you are having is identical to that which Jimmy had. Something has happened to the CollectionView that I just cannot figure out.

The only solution was to delete the collectionView and add it back in again and then connect up the elements (collectionView in ViewController and the imageViews in CardCollectionViewCell).

Works fine now.

I would recommend that you re-create the collectionView in your version. Good practise for you.

So to correct your version you need to:

  • Delete the collectionView from storyboard.
  • Add a new one in from the object Library. make sure that you select UICollectionView
  • Constrain it to the safeArea of the View - 0 on all for sides.
  • Set the background of the CollectionView to Clear Color
  • Assign a reuse identifier to the Collection View Cell
  • Set the size of the Cell to 158 x 224
  • Assign the Custom class CardCollectionViewCell to the Collection View Cell
  • Add the two image views into the ContentView of the cell
  • Assign an image to the front and back
  • Constrain each to the ContentView - 0 on all sides
  • Add outlets for the collectionView and each of the imageViews (frontImageView and backImageView)
  • Set Xcode into Assistant Editor Mode. Simplest way is to hold the Option key and click on ViewContoller or CardCollectionViewCell and re-establish the Outlets.

Given that you already have the code in place for the IBOutlets in both ViewController and CardCollectionViewCell you can very quickly reconnect them by clicking on the circle at the line number and drag that across to the entry in the Document Outline.

As an example if you have ViewController visible in Assistant Editor Mode then where you have the line @IBOutlet weak var collectionView: UICollectionView! you will see the circle on the left where the line number is. Click on it and drag that (a blue line will show as you drag it) to Collection View in the Document Outline and let go as you hover over the name Collection View. That will re-connect the link. Do the same for the frontImageView and backImageView in CardCollectionViewCell.

A point to note when you name things. There is a naming convention for constants, variables and functions (methods). They should alway be defined with the first letter of the name as lower case and any subsequent word in the name should have the first letter in Uppercase. When you name a class or a reuse Identifier the normal accepted naming method is for all words to have the first letter Upper Case. So the reuse identifier for card cell should be CardCell.

Hope that helps.

Wow, thanks. It’s working now :slight_smile:

1 Like