Valentin Scheldeman
Valentin Scheldeman

Reputation: 51

Collectionview with multiple different collection viewcell

I'm building a survey app and I want to use such view (the view)

in this example there's only two answer possible but I want to be possible to have like 3 / 4 answer and different kind of survey,

I will receive a JSON to build it with the type of the question and the answer possible etc ..

My main problem is that I don't really know how to proceed, I'm a newbie on iOS development atm and I don't want to try too many thing and have spaghetti code so if someone have an idea on how to do this collection view with different view depending on the json

Thanks o/

Upvotes: 0

Views: 1286

Answers (1)

Govind Kumawat
Govind Kumawat

Reputation: 1592

There is lot of ways to achieve it but as in your case you want with Collectionview with multiple different collection viewcell

In ViewController.swift, conform few UICollectionView protocol.

    class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate , UICollectionViewDelegateFlowLayout{

        @IBOutlet weak var mainCollectionView: UICollectionView!

        override func viewDidLoad() {
            super.viewDidLoad()
             mainCollectionView.isScrollEnabled = false
        }

then implement collection view data source and delegate methods.

// MARK: - UICollectionViewDataSource protocol

// tell the collection view how many cells to make
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return 3
}


// make a cell for each cell index path
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {



    print("indexPath.row \(indexPath.row)")
    if indexPath.row == 0{
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "firstCell", for: indexPath)
        if let button = cell.contentView.viewWithTag(2) as? UIButton{
            button.addTarget(self, action: #selector(MoveToNextCell), for: .touchUpInside)
        }
        return cell
    }

    else if indexPath.row == 1{
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "secondCell", for: indexPath)
        if let button = cell.contentView.viewWithTag(3) as? UIButton{
            button.addTarget(self, action: #selector(MoveToNextCell), for: .touchUpInside)
        }

        return cell
    }

    else{
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "thirdCell", for: indexPath)
        if let button = cell.contentView.viewWithTag(4) as? UIButton{
            button.addTarget(self, action: #selector(MoveToNextCell), for: .touchUpInside)
        }
        return cell
    }
}


// MARK: - UICollectionViewDelegate protocol

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    // handle tap events
    print("You selected cell #\(indexPath.item)!")
}

then implement UICollectionViewDelegateFlowLayout methods.

func collectionView(_ collectionView: UICollectionView,
                        layout collectionViewLayout: UICollectionViewLayout,
                        sizeForItemAt indexPath: IndexPath) -> CGSize {

            return CGSize(width: self.view.frame.width , height: self.view.frame.height)


    }

    func collectionView(_ collectionView: UICollectionView,
                        layout collectionViewLayout: UICollectionViewLayout,
                        minimumInteritemSpacingForSectionAt section: Int) -> CGFloat {
        return 1.0
    }

    func collectionView(_ collectionView: UICollectionView, layout
        collectionViewLayout: UICollectionViewLayout,
                        minimumLineSpacingForSectionAt section: Int) -> CGFloat {
        return 1.0
    }

Then finally for moving between cells

func MoveToNextCell(){

        let collectionBounds = self.mainCollectionView.bounds
        let contentOffset = CGFloat(floor(self.mainCollectionView.contentOffset.x + collectionBounds.size.width))
        self.moveToCell(contentOffset: contentOffset)
    }

    func moveToPreviousCell(){
        let collectionBounds = self.mainCollectionView.bounds
        let contentOffset = CGFloat(floor(self.mainCollectionView.contentOffset.x - collectionBounds.size.width))
        self.moveToCell(contentOffset: contentOffset)
    }

    func moveToCell(contentOffset: CGFloat){
        let frame: CGRect = CGRect(x : contentOffset ,y : self.mainCollectionView.contentOffset.y ,width : self.mainCollectionView.frame.width,height : self.mainCollectionView.frame.height)
        self.mainCollectionView.scrollRectToVisible(frame, animated: true)
    }

That's pretty much all you need to achieve that.

Upvotes: 1

Related Questions