CollectionViewCells don't appear programmatically - Swift 5 - ios

I want to show a collectionView that appears with animation after hitting a button.
The collectionView appears correctly but the collectionViewCells inside don't.
I have set the UICollectionViewDelegate and UICollectionViewDatasource methods correctly but they aren't called (tested with breakPoints).
I'm doing everything programmatically so I also had to register the SettingCell which is a common UICollectionViewCell to the respective cellID.
Also I thought there could be a problem since I was setting the delegate and datasource too late but I don't think so since they are set at the beginning in the init of the mother class.
class SettingsLauncer : NSObject, UICollectionViewDelegate, UICollectionViewDataSource{
var collectionView : UICollectionView = {
let layout = UICollectionViewLayout()
let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)
cv.backgroundColor = .white
return cv
}()
let CelliD = "CelliD"
func handleMoreButton(){
//creating and adding View
if let windowView = UIApplication.shared.keyWindow {
let width = UIScreen.main.bounds.width
let height = UIScreen.main.bounds.height
let heightCollectionView = CGFloat(300)
let myHeight = height - heightCollectionView
collectionView.frame = CGRect(x: 0, y: height, width: width, height: 0)
UIView.animate(withDuration: 0.3, delay: 0, options: .curveEaseOut, animations: {
windowView.addSubview(self.collectionView)
self.collectionView.frame = CGRect(x: 0, y: myHeight, width: width, height: heightCollectionView)
}, completion: nil)
}
}
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 3
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: CelliD, for: indexPath)
return cell
}
override init(){
super.init()
collectionView.register(SettingCell.self, forCellWithReuseIdentifier: CelliD)
collectionView.delegate = self
collectionView.delegate = self
}
}

please add these two lines in your init method
self.collectionView.delegate = self
self.collectionView.dataSource = yourDataSource
currently you are having
collectionView.delegate = self
collectionView.delegate = self
Also make your collectionView lazy ... and assign delgates there
private lazy var collectionView : UICollectionView = {
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = .horizontal
let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)
cv.backgroundColor = .white
cv.delegate = self
cv.dataSource = yourDataSource
cv.translatesAutoresizingMaskIntoConstraints = false
return cv
}()

Related

I am implementing UICollectionView with two rows of cells and I need both can be scroll horizontally at the same time

I have a UICollectionView that has horizontal scrolling. I need to place all my collection view cells in two rows and both should scroll horizontally. The layout is as shown in the screenshot.
As shown in the above screenshot, I am going to have to build two rows which will scroll horizontally, i.e., both rows will scroll together in the same direction.
I had earlier considered using sections in the scroll view, but then the scrolling would probably be independent, and so, I am hoping to find a better solution.
I looked into this link here : A similar post
This link uses a tableview to hold multiple collection views. Even though solution seems good, I am really not sure if it could work for me, I wish to know if there is a better alternative.
I looked into other stack overflow posts regarding the same (Can’t remember which though), but they did not help much.

Now normally, we would have two columns in the collection view and we can scroll vertically. Instead of this behavior, is there any way to have two rows in a UICollectionView which can scroll horizontally and simultaneously?
Should I consider using two collection views and have some logic that binds the scrolling of both the views? (I’d rather not have two UICollectionviews just to solve this problem)

Also, I am doing this through pure code. No storyboards or xib files have been used.
Can you try the code below?
I was able to do this i guess
class CollectionViewController: UIViewController {
#IBOutlet weak var collectionView: UICollectionView!
override func viewDidLoad() {
super.viewDidLoad()
setUpCollectionView()
}
fileprivate func setUpCollectionView() {
let collectionFlowLayout = UICollectionViewFlowLayout()
collectionFlowLayout.scrollDirection = .horizontal
collectionFlowLayout.itemSize = CGSize(width: 145, height: 145)
collectionView.setCollectionViewLayout(collectionFlowLayout, animated: true)
collectionView.delegate = self
collectionView.dataSource = self
}
}
extension CollectionViewController: UICollectionViewDelegate, UICollectionViewDataSource {
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 100
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CustomCollectionViewCell", for: indexPath)
if indexPath.row % 2 == 0 {
cell.contentView.backgroundColor = UIColor.red
} else {
cell.contentView.backgroundColor = UIColor.green
}
return cell
}
}
NOTE: I have set collectionView height as 300
OUTPUT
Use 2 collectionView
let CellId1 = "CellId1"
lazy var collectionViewOne: UICollectionView = {
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = .horizontal
layout.minimumLineSpacing = 0
let width = collectionView.frame.width
let collectionViewOne = UICollectionView(frame: CGRect(x: 0, y: 100, width: width, height: 100), collectionViewLayout: layout)
collectionViewOne.showsHorizontalScrollIndicator = false
collectionViewOne.backgroundColor = .red
return collectionViewOne
}()
let CellId2 = "CellId2"
lazy var collectionViewTwo: UICollectionView = {
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = .horizontal
layout.minimumLineSpacing = 0
let collectionViewTwo = UICollectionView(frame: CGRect(x: 0, y: 250, width: width, height: 100), collectionViewLayout: layout)
collectionViewTwo.backgroundColor = .blue
return collectionViewTwo
}()
then for obtaining the numberOfItem and cellForRow:
override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
if collectionView == self.collectionViewOne {
return 10
} else if collectionView == self.collectionViewTwo {
return 20
}
}
override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
if collectionView == self.collectionViewOne {
let Cell1 = collectionViewOne.dequeueReusableCell(withReuseIdentifier: CellId1, for: indexPath)
Cell1.backgroundColor = .green
return Cell1
} else if collectionView == self.collectionViewTwo {
let Cell2 = collectionViewTwo.dequeueReusableCell(withReuseIdentifier: CellId2, for: indexPath )
Cell2.backgroundColor = .purple
return Cell2
}
}
and don't forget to register the collectionView in viewDidLoad()
collectionViewOne.delegate = self
collectionViewOne.dataSource = self
collectionViewTwo.delegate = self
collectionViewTwo.dataSource = self
collectionViewOne.register(Cell1.self, forCellWithReuseIdentifier: storyCell)
collectionViewTwo.register(Cell2.self, forCellWithReuseIdentifier: cardCell)

Multiple Collection Views with in a viewController with different number of cells

There seems to be a similar question here but it didn't solve my problem.
I created two collectionViews in my viewController as follows :
let y = self.view.frame.height
titleView = UIView(frame : CGRect(x: 0 , y: 50 , width: self.view.frame.width, height: y - 100 ))
let middle = CGPoint(x: 10, y: titleView.bounds.height/10)
let frame = CGRect(origin: middle , size: CGSize(width: self.view.frame.width - 20 , height: 70))
let layout = UICollectionViewFlowLayout()
fontCollection = UICollectionView(frame: frame, collectionViewLayout: layout)
fontCollection.dataSource = self
fontCollection.delegate = self
fontCollection.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "fontsIdentifier")
fontCollection.backgroundColor = UIColor.white
// Do any additional setup after
colorCollection = UICollectionView(frame: frame, collectionViewLayout: layout)
//colorCollection.frame.origin.y = fontCollection.frame.origin.y + (2 * fontCollection.frame.height)
colorCollection.dataSource = self
colorCollection.delegate = self
colorCollection.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "colorsIdentifier")
colorCollection.backgroundColor = UIColor.white
// Do any additional setup after
These are my UICollectionViewDataSource methods :
func numberOfSections(in collectionView: UICollectionView) -> Int {
collectionView.reloadData()
collectionView.collectionViewLayout.invalidateLayout()
return 1
}
public func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
if(collectionView == self.colorCollection ){
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "colorsIdentifier", for: indexPath)
cell.backgroundColor = .darkGray
return cell
} else {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "fontsIdentifier", for: indexPath)
cell.backgroundColor = .gray
return cell
}
}
Then I use a segmented control to switch between the two collectionViews.
Everything goes as desired upto this point.However when I want to allocate different number of cells to either collectionView I get this error :
UICollectionView received layout attributes for a cell with an index
path that does not exist: {length =
2, path = 0 - 6}
This is my numberOfItemsInSection method
public func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
if(collectionView == self.colorCollection ){ return 9 }
else if(collectionView == self.fontCollection ){ return 6 }
return 0
}
Am I doing something wrong? What am I missing?
As #Rajesh73 pointed out in the comment , the problem was in assigning one layout to both the collectionViews. So I gave the both collectionViews different layouts and it solved the problem.
Thus replacing
let layout = UICollectionViewFlowLayout()
fontCollection = UICollectionView(frame: frame, collectionViewLayout: layout)
colorCollection = UICollectionView(frame: frame, collectionViewLayout: layout)
with
let fontsLayout = UICollectionViewFlowLayout()
fontCollection = UICollectionView(frame: frame,collectionViewLayout: fontsLayout)
let colorsLayout = UICollectionViewFlowLayout()
colorsCollection = UICollectionView(frame: frame collectionViewLayout: colorsLayout)
solved the issue.

Reuse identifier when using two different collection views

Riddle me this. I have a view that I'm implementing two different collection views on. The two collection views are setup nearly identically.
When I add both to my view, my app calls an error:
*** Terminating app due to uncaught exception 'NSInternalInconsistencyException', reason: 'could not dequeue a view of kind: UICollectionElementKindCell with identifier CollectionViewPantsCell - must register a nib or a class for the identifier or connect a prototype cell in a storyboard'
Which doesn't make sense, as I registered it the exact same as my CollectionViewShirtCell.
To debug, I removed the pants collection, and rewrote my "cellForItemAt" method to be really simple. It worked fine with one collectionView.
So, what is the difference? I've added some notes in caps in the code.
import UIKit
class HomeController: UIViewController, UICollectionViewDelegateFlowLayout, UICollectionViewDataSource {
let collectionViewShirtsIdentifier = "CollectionViewShirtsCell"
let collectionViewPantsIdentifier = "CollectionViewPantsCell"
var shirtStore: ShirtStore!
var pantStore: PantStore!
public var collectionViewShirts : UICollectionView{
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = UICollectionViewScrollDirection.horizontal
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height/2), collectionViewLayout: layout)
collectionView.backgroundColor = UIColor.orange
collectionView.delegate = self
collectionView.dataSource = self
collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: collectionViewShirtsIdentifier)
return collectionView
}
public var collectionViewPants : UICollectionView{
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = UICollectionViewScrollDirection.horizontal
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height/2), collectionViewLayout: layout)
collectionView.backgroundColor = UIColor.blue
collectionView.delegate = self
collectionView.dataSource = self
collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: collectionViewPantsIdentifier)
return collectionView
}
override func viewDidLoad() {
super.viewDidLoad()
navigationItem.title = "Hanger"
self.view.addSubview(collectionViewShirts)
///... CANT ADD THE SECOND COLLECTION????
// self.view.addSubview(collectionViewPants)
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
if collectionView == self.collectionViewShirts {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: collectionViewShirtsIdentifier, for: indexPath as IndexPath)
return cell
}
else
{
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: collectionViewPantsIdentifier, for: indexPath as IndexPath)
return cell
}
}
///... THIS VERSION WORKS IF I ONLY TRY TO MANIPULATE ONE COLLECTION
// func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
// let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CollectionViewShirtsCell", for: indexPath as IndexPath)
//
// return cell
// }
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int{
if(collectionView == collectionViewShirts)
{
print(shirtStore.allShirts.count)
return shirtStore.allShirts.count
}
else if (collectionView == collectionViewPants)
{
return pantStore.allPants.count
}
else
{
return 5//shoeStore.allShoes.count
}
}
}
The way you are setting up your collectionViewShirts and collectionViewPants variables is incorrect. As a result, the if test in cellForItemAt: is falling through to the else and you are attempting to dequeue a 'pants' cell for the 'shirts' collection view.
You need to declare your collection views properly:
public var collectionViewShirts : UICollectionView = {
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = UICollectionViewScrollDirection.horizontal
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height/2), collectionViewLayout: layout)
collectionView.backgroundColor = UIColor.orange
collectionView.delegate = self
collectionView.dataSource = self
collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: collectionViewShirtsIdentifier)
return collectionView
}()
public var collectionViewPants : UICollectionView = {
let layout = UICollectionViewFlowLayout()
layout.scrollDirection = UICollectionViewScrollDirection.horizontal
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: view.frame.height/2), collectionViewLayout: layout)
collectionView.backgroundColor = UIColor.blue
collectionView.delegate = self
collectionView.dataSource = self
collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: collectionViewPantsIdentifier)
return collectionView
}()
Note the = and the () at the end of the closure. This tells Swift to assign the value returned by invoking the anonymous function.
I would also suggest that you use constraints rather than setting the frame directly, as this won't work with view rotation and the frame won't be set correctly at the time you are initialising the collection views, as the view frame is only set when viewDidLayoutSubviews is called.
As I mentioned earlier, doing this sort of stuff in Storyboard is much simpler.

Swift how to resize UICollectionViewCell based on it's content

I have got this Swift code
let collectionView = UICollectionView(frame: CGRect(x:0,y:0,width:0,height:0),
collectionViewLayout: UICollectionViewFlowLayout())
collectionView.translatesAutoresizingMaskIntoConstraints = false
collectionView.register(PostCell.self, forCellWithReuseIdentifier: cellId)
collectionView.delegate = self
collectionView.dataSource = self
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: cellId, for: indexPath) as! PostCell
return cell
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets
{
return UIEdgeInsets(top: 15, left: 5, bottom: 15, right: 5)
}
My goal is to make cell's height automatic based on it's content.I wanted to implement
if let flowLayout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
flowLayout.estimatedItemSize = UICollectionViewFlowLayoutAutomaticSize
}
and
let layoutHeight = UICollectionViewFlowLayout()
layoutHeight.estimatedItemSize = CGSize(width: 100, height: 100)
collectionView = UICollectionView(frame: CGRect(x:0,y:0,width:0,height:0), collectionViewLayout: layoutHeight)
But the first one made all cells 50x50 and the second one made them 100x100.Here is my PostCell class
class PostCell: UICollectionViewCell {
override init(frame: CGRect) {
super.init(frame: frame)
designCell()
}
required init?(coder aDecoder: NSCoder) {
fatalError("init(coder:) has not been implemented")
}
let CellprofileImage: UIImageView = {
let v = UIImageView()
v.layer.cornerRadius = 55
v.layer.masksToBounds = true
v.layer.borderWidth = 3
v.layer.borderColor = UIColor(white: 0.5, alpha: 1).cgColor
v.image = #imageLiteral(resourceName: "guitar")
v.translatesAutoresizingMaskIntoConstraints = false
return v
}()
func designCell(){
addSubview(CellprofileImage)
backgroundColor = .red
cellConstraints()
}
func cellConstraints(){
CellprofileImage.topAnchor.constraint(equalTo: self.topAnchor,constant:20).isActive = true
CellprofileImage.leftAnchor.constraint(equalTo: self.leftAnchor,constant:20).isActive = true
CellprofileImage.widthAnchor.constraint(equalToConstant: 310).isActive = true
CellprofileImage.heightAnchor.constraint(equalToConstant: 310).isActive = true
}
}

UICollectionViewController Error in Swift 3.0: must be initialized with a non-nil layout parameter

I'm new to iOS development.
I've been learning Swift, and today, I tried using UICollectionViewController.
My code is as follows:
class ViewController: UICollectionViewController, UICollectionViewDelegateFlowLayout {
var colView: UICollectionView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
layout.sectionInset = UIEdgeInsets(top: 20, left: 10, bottom: 10, right: 10)
layout.itemSize = CGSize(width: 90, height: 120)
colView = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)
colView.dataSource = self
colView.delegate = self
colView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "Cell")
colView.backgroundColor = UIColor.white
self.view.addSubview(colView)
}
func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 14
}
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath as IndexPath)
cell.backgroundColor = UIColor.orange
return cell
}
}
However, when I try to run it, I get the following error:
*** Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: 'UICollectionView must be initialized with a non-nil layout parameter'
I have looked up previous posts discussing this issue, but I couldn't find anything that fixed my code.
How should I fix this?
Thank you! I incorporated your suggestions. Below is the code that works:
class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
let cellId = "CellId"
var colView: UICollectionView!
override func viewDidLoad() {
super.viewDidLoad()
let layout = UICollectionViewFlowLayout()
layout.sectionInset = UIEdgeInsets(top: 20, left: 10, bottom: 10, right: 10)
layout.itemSize = CGSize(width: 111, height: 111)
colView = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)
colView.delegate = self
colView.dataSource = self
colView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "Cell")
colView.backgroundColor = UIColor.white
self.view.addSubview(colView)
}
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 21
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath as IndexPath)
cell.backgroundColor = UIColor.orange
return cell
}
}
Again, thank you guys very much. Have an awesome day :D
func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
let cellSize = CGSize(width: 90, height: 120)
//
return CGSizeMake(cellSize)
}
func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAtIndex section: Int) -> UIEdgeInsets {
return UIEdgeInsetsMake(top: 20, left: 10, bottom: 10, right: 10)
}
This should work:
lazy var collectionView: UICollectionView = {
let layout = UICollectionViewFlowLayout()
let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
return collectionView
}()
Just change the order like below one :
let layout = UICollectionViewFlowLayout()
layout.sectionInset = UIEdgeInsets(top: 20, left: 10, bottom: 10, right: 10)
layout.itemSize = CGSize(width: 90, height: 120)
colView = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)
self.view.addSubview(colView)
colView.delegate = self
colView.dataSource = self
colView.registerClass(UICollectionViewCell.self, forCellWithReuseIdentifier: "Cell")
colView.backgroundColor = UIColor.white
You can set your code like this:
class ViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
let cellId = "Cell"
lazy var collectionView: UICollectionView = {
let layout = UICollectionViewFlowLayout()
// ... layout parameters
let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)
cv.backgroundColor = .white
cv.delegate = self
cv.dataSource = self
return cv
}()
override func viewDidLoad() {
super.viewDidLoad()
view.addSubview(collectionView)
// ... add your auto layout constraints to the collection view
collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: cellId)
}
// Delegate and Data Source Methods...
}

Resources