CODEWITHSUNDEEP
iosswiftuicollectionview
Kirill
Kirill

Reputation: 1472

UICollectionView with multiple rows

I use UICollectionView (views with UIButtons) to book the time:

    override func viewDidLoad() {
        super.viewDidLoad()        
        collectionViewTime.register(UINib(nibName: "TimeCollectionViewCell", bundle: nil), forCellWithReuseIdentifier: "timecell")
        collectionViewTime.dataSource = self
        collectionViewTime.delegate = self        
        if let layout = collectionViewTime.collectionViewLayout as? UICollectionViewFlowLayout {
            layout.scrollDirection = .vertical
        }

    }

    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return 1
    }

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return Timeline.count
    }

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets {            
        let flowLayout = collectionViewLayout as! UICollectionViewFlowLayout
        let numberOfItems = CGFloat(collectionView.numberOfItems(inSection: 0))
        let combinedItemWidth = (numberOfItems * flowLayout.itemSize.width) + ((numberOfItems - 1)  * flowLayout.minimumInteritemSpacing)
        let padding = (collectionView.frame.width - combinedItemWidth) / 2
        return UIEdgeInsets(top: 0, left: padding, bottom: 0, right: padding)
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {            
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "timecell", for: indexPath) as! TimeCollectionViewCell            
        let time = Timeline[indexPath.row][0]
        cell.btnTime.setTitle(DateManager.dateToTime(date: time.0), for: .normal)            
        return cell
    }

And I got all views (UIButtons) in one line: UICollectionView How can I set automatically moving UIViews in new rows? So, in my case (iPad) one row will contain 7 UIViews, iPhone will contain 4-5 UIViews in one row.

Upvotes: 0

Views: 3325

Answers (2)

Ashish vani
Ashish vani

Reputation: 1

Please use one more flow delegate method as below

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize;
------
 func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width:(button width), height:button hieght);
    }

Upvotes: 0

Nirav D
Nirav D

Reputation: 72410

For that you need to implement UICollectionViewDelegateFlowLayout method collectionView(_:layout:sizeForItemAt:) and change the collectionView's Scroll direction to Vertical

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    let minCellSpace: CGFloat = 10 //Set minimum cell space that you want
    if UIDevice.current.userInterfaceIdiom == .pad {
         //For iPad return 7 cell as you mention in question
         return CGSize(width: (collectionView.frame.size.width / 7) - minCellSpace, height: yourCellHeight)
    }
    else {
         //For iPhone return 4 cell, if you want to return 5 cell divide width to 5
         return CGSize(width: (collectionView.frame.size.width / 4) - minCellSpace, height: yourCellHeight)
    }
}

Upvotes: 1

Related Questions