UICollectionView Pt 3: DESIGN CUSTOM UICOLLECTIONVIEWCELL IN STORYBOBARD

[ad_1]
JOIN ME IN THIS COURSE FOR FREE:

Collection View is what enables us developers to build beautiful and stunning user interface like what you see in App Store, Instagram, Facebook, Spotify, Snapchat and Apple Music.

That’s why nowadays ever developer must master these foundational skills to set up UICollectionView and UICollectionViewController.

Join me in this course for free. You’ll learn everything about UICollectionView in these 9 lessons:
1 – Introduction to UICollectionView
2 – Set up data structure for the app
3 – Design Collection View in Storyboard with Auto Layout
4. Create Photo Cell subclassing UICollectionViewCell
5. Create Photos CollectionViewController
6. Create multiple sections and section header views
7. Transition to Detail View using UICollectionViewDelegate and Show Segue
8. Add new random items to collection view with animation
9. Delete items from UICollectionView

JOIN ME IN THIS COURSE FOR FREE:

********************************
*** ABOUT CODE MASTERY ***
********************************
Code Mastery is hosted by Duc Tran, founder of Developers Academy.

This is his free-style no notes, no teleprompter presentation and live coding broadcast with you guys everyday.

To join Duc’s free courses, register for free at

*************************
*** MEET DUC TRAN ***
*************************

Duc Tran is founder of Developers Academy, one of the world’s leading iOS, Android and Web development trainers.

More than 2,000,000 developers have studied his video trainings; 100,000 developers see his posts each month. Each year, Duc has helped 20,000 plus developers graduate from his online courses or video series.

*************************************************
*** FREE TRAININGS IN IOS DEVELOPMENT ***
*************************************************
To subscribe and get free tutorials, courses and weekly content, visit me at:
Connect with Duc on facebook:
Tweet him:
Get daily inspiration:

********************
CODE FROM THE COURSE
********************

PhotosCollectionViewController.swift

class PhotosCollectionViewController : UICollectionViewController
{
override func numberOfSections(in collectionView: UICollectionView) – Int {
return photoCategories.count
}

override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) – Int {
return photoCategories[section].imageNames.count
}

override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) – UICollectionViewCell
{
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: Storyboard.photoCell, for: indexPath) as! PhotoCell
let photoCategory = photoCategories[indexPath.section]
let imageNames = photoCategory.imageNames
let imageName = imageNames[indexPath.item]

cell.imageName = imageName
cell.delegate = self

return cell
}

// Section Header View

override func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) – UICollectionReusableView
{
let sectionHeaderView = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: Storyboard.sectionHeaderView, for: indexPath) as! SectionHeaderView
let category = photoCategories[indexPath.section]

sectionHeaderView.photoCategory = category

return sectionHeaderView
}

// MARK: – UICollectionViewDelegate

var selectedImage: UIImage!

override func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath)
{
let category = photoCategories[indexPath.section]
selectedImage = UIImage(named: category.imageNames[indexPath.item])

performSegue(withIdentifier: Storyboard.showDetailVC, sender: nil)
}

// MARK: – Delete Items

override func setEditing(_ editing: Bool, animated: Bool) {
super.setEditing(editing, animated: animated)

addBarButtonItem.isEnabled = !editing
if let indexPaths = collectionView?.indexPathsForVisibleItems {
for indexPath in indexPaths {
if let cell = collectionView?.cellForItem(at: indexPath) as? PhotoCell {
cell.isEditing = editing
}
}
}
}

To get the full source code, join me in this course:


Posted

in

by

Tags:

Comments

2 responses to “UICollectionView Pt 3: DESIGN CUSTOM UICOLLECTIONVIEWCELL IN STORYBOBARD”

  1. Daniel Avatar

    Hey Duc, is there anywhere I can download this whole project? I seem to have come across a bug and I'm not sure if it's my own fault by not following along closely or if it is a problem in the code itself

  2. Ali Saleem Avatar

    Great video Thanks Duc .Please Upload video on UIpageviewcontroller….

Leave a Reply

Your email address will not be published. Required fields are marked *