How to implement different collection view cell types in a single collection View?

Question

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

    let dev = devices[indexPath.item]
    if dev.cuid == "3011"{

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "LightViewCell", for: indexPath) as! LightViewCell
        let visibility = self.getStatusFor(nodeID: dev.node_id!, endpoint: dev.end_point!, devicename: dev.device_name!)
        if visibility.contains("0"){
            cell.LigntIMG.image = #imageLiteral(resourceName: "bulb-off")
            cell.LightName.text = dev.device_name
            cell.status = 0
            cell.index = indexPath
            cell.controlCMDs = getControlCMDS(nodeID: dev.node_id!, endpoint: dev.end_point!)
            cells.append(cell)
        }else{
            cell.LigntIMG.image = UIImage(named: dev.menu_id!)
            cell.LightName.text = dev.device_name
            cell.status = 1
            cell.index = indexPath
            cell.controlCMDs = getControlCMDS(nodeID: dev.node_id!, endpoint: dev.end_point!)
            cells.append(cell)
        }
          return cell
    }


        else if dev.cuid == "3006"{
          let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "DimmerLightViewCell", for: indexPath) as! DimmerLightViewCell
          return cell
        }

    return //
    }

I am having two types of custom cells(LightViewCell/DimmerLightViewCell) based on the conditions i need to display any one of the two cells...... types

here i am not returning any value, ignore that error.....i need to know how to implement the the above requirement..

Thank you:)

Why don't you categorise according to `indexPath`? – Anurag Sharma Jun 19 '17 at 10:01 — Anurag Sharma, Jun 19 '17 at 10:01
@Anurag I cant get you...can you explain it clearly... – selva balasubramanian Jun 19 '17 at 10:08 — selva balasubramanian, Jun 19 '17 at 10:08
let me try it...Thanks – selva balasubramanian Jun 19 '17 at 10:59 — selva balasubramanian, Jun 19 '17 at 10:59

score 0 · Answer 1 · answered Jun 19 '17 at 10:07

The method must return the cell. You can try this code:

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

    let dev = devices[indexPath.item]
    if dev.cuid == "3011"{

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "LightViewCell", for: indexPath) as! LightViewCell
        let visibility = self.getStatusFor(nodeID: dev.node_id!, endpoint: dev.end_point!, devicename: dev.device_name!)
        if visibility.contains("0"){
            cell.LigntIMG.image = #imageLiteral(resourceName: "bulb-off")
            cell.LightName.text = dev.device_name
            cell.status = 0
            cell.index = indexPath
            cell.controlCMDs = getControlCMDS(nodeID: dev.node_id!, endpoint: dev.end_point!)
            cells.append(cell)
        }else{
            cell.LigntIMG.image = UIImage(named: dev.menu_id!)
            cell.LightName.text = dev.device_name
            cell.status = 1
            cell.index = indexPath
            cell.controlCMDs = getControlCMDS(nodeID: dev.node_id!, endpoint: dev.end_point!)
            cells.append(cell)
        }
          return cell
    } else {
          let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "LightViewCell", for: indexPath) as! DimmerLightViewCell
          return cell
        }

    return //
    }

score 0 · Answer 2 · answered Jun 19 '17 at 10:11

0

you can do it by simply by using your condition in cellForRowAtIndexPath

For Example

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    if(indexPath.item > 0){
         let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "LightViewCell", for: indexPath) as! LightViewCell
         /*do setup here*/

         return cell
   }else{
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "DimmerLightViewCell", for: indexPath) as! DimmerLightViewCell
        /*do setup here*/

        return cell
   }    
 }

answered Jun 19 '17 at 10:11

Er. Khatri

1,384
11
29

You can change the conditon as per your requirement i have simply made a condition for first cell of a section of collectionview... – Er. Khatri Jun 19 '17 at 10:12
Sry I working in iOS for past two only...I cant get your procedure...can you refer me any tutorial regarding that indexpath...and how the above one works – selva balasubramanian Jun 19 '17 at 10:17

score 0 · Answer 3 · answered Jun 19 '17 at 12:44

I don't exactly understand what is the problem that you are facing.

But, you can try the below code for returning cell according to the given conditions in your code:

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell
{
    let dev = devices[indexPath.item]
    if dev.cuid == "3011"
    {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "LightViewCell", for: indexPath) as! LightViewCell

        let visibility = self.getStatusFor(nodeID: dev.node_id!, endpoint: dev.end_point!, devicename: dev.device_name!)
        cell.status = visibility.contains("0") ? 0 : 1
        cell.LigntIMG.image = visibility.contains("0") ? #imageLiteral(resourceName: "bulb-off") : UIImage(named: dev.menu_id!)
        cell.LightName.text = dev.device_name
        cell.index = indexPath
        cell.controlCMDs = getControlCMDS(nodeID: dev.node_id!, endpoint: dev.end_point!)
        cells.append(cell)
        return cell
    }
    else if dev.cuid == "3006"
    {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "DimmerLightViewCell", for: indexPath) as! DimmerLightViewCell
        return cell
    }
    return UICollectionViewCell()
}

How to implement different collection view cell types in a single collection View?

3 Answers3