How to fill tableview with two arrays using single custom cell?

Question

I want to display two array values in tableview using single cell. Suppose i have two array and both contains same no of elements.

FirstArray and SecondArray. there is two label in tableview cell Lbl1 and Lbl2, now Lbl1 should fill with FirstArray and Lbl2 Should fill with SecondArray. I know that we can not use two array for uitableview datasource . I can not figure out how to do this.

Please help me.

I also tried using multiple custom tableview cells with section. but it did not give the desired result.

I have two Array -

let datalist1 = ["firstCell1" , "firstCell2" , "firstCell3" , "firstCell4"]
    let datalist2 = ["secondCell1"  ,"secondCell2" , "secondCell3" ,"secondCell4"]

In tableview numberOfRowsInSection :

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

        if section == 0
        {
            return datalist1.count
        }
        else  {
            return datalist2.count
        }
    }

In cellForRowAt :

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        if indexPath.section == 0 {
            let cell = tableView.dequeueReusableCell(withIdentifier: "cell1", for: indexPath) as? FirstCell
            cell?.initData(name: datalist1[indexPath.row])
            return cell!
        }
        else {
            let cell = tableView.dequeueReusableCell(withIdentifier: "cell2", for: indexPath) as? SecondCell
            cell?.initData(lbl: datalist2[indexPath.row])
            return cell!
        }

    }

Actual Output :

FirstCell1 FirstCell2 FirstCell3 FirstCell4 SecondCell1 SecondCell2 SecondCell3 SecondCell4

Expected Output:

FirstCell1 SecondCell1 FirstCell2 SecondCell2 FirstCell3 SecondCell3 FirstCell4 SecondCell4

It seems like you have two kinds of cells - `FirstCell` and `SecondCell`. But in your question, you seem to imply you have one kind of cell, and that kind of cell have 2 labels? — Sweeper, Jun 21 '19 at 07:00
For your expected output you need to make 2 changes. 1. Keep single section and double the numberOfRowsInSection 2. In cellForRowAt if `indexPath.row % 2 == 0` then init with datalist1 else init with datalist2. That's it. — Pavan Kotesh, Jun 21 '19 at 07:04
yes i want this in single cell only but to get expected output i tried with two cells.@Sweeper — PUJA SINGH, Jun 21 '19 at 07:15
I Tried The Way @Pavan suggest but now it is throwing error. — PUJA SINGH, Jun 21 '19 at 08:14

score 1 · Accepted Answer · answered Jun 21 '19 at 07:20

Hello You not need to add two section just do as bellow. This is your arrays.

let datalist1 = ["firstCell1" , "firstCell2" , "firstCell3" , "firstCell4"]
let datalist2 = ["secondCell1"  ,"secondCell2" , "secondCell3" ,"secondCell4"]

Number of rows

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {


    return datalist1.coun
}

Cell for row

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

    let cell = tableView.dequeueReusableCell(withIdentifier: "cell1", for: indexPath) as? FirstCell
    cell.Lbl1.text = datalist1[indexPath.row]
    cell.Lbl2.text = datalist2[indexPath.row]
    return cell!
}

Make sure both arrays are equal objects counts. – Harsh Pipaliya Jun 21 '19 at 07:23 — Harsh Pipaliya, Jun 21 '19 at 07:23

score 1 · Answer 2 · answered Jun 21 '19 at 07:24

Based on the explanation and code, you have provided, the requirement is not clear. However, there may be two cases based on the above details:

Case-1:

Cell-1 : FirstCell1

Cell-2 : SecondCell1

Cell-3 : FirstCell2

Cell-4 : SecondCell2

Then you can implement something like below:

In tableview numberOfRowsInSection :

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return (datalist1.count + datalist2.count)
}

In cellForRowAt :

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

    if indexPath.row % 2 == 0 {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell1", for: indexPath) as? FirstCell
        cell?.initData(name: datalist1[indexPath.row])
        return cell!
    }
    else {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell2", for: indexPath) as? SecondCell
        cell?.initData(lbl: datalist2[indexPath.row])
        return cell!
    }

}

Case-2:

Cell-1 : FirstCell1 SecondCell1

Cell-2 : FirstCell2 SecondCell2

Cell-3 : FirstCell3 SecondCell3

Cell-4 : FirstCell4 SecondCell4

Then you can implement something like below:

In tableview numberOfRowsInSection :

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
   return datalist1.count
}

In cellForRowAt :

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        let cell = tableView.dequeueReusableCell(withIdentifier: "cell1", for: indexPath) as? FirstCell
        //Single custom cell can implement both the labels
        cell?.initData(name: datalist1[indexPath.row],lbl: datalist2[indexPath.row])
        return cell!
    }

}

score 0 · Answer 3 · answered Jun 21 '19 at 07:16

You've to Declare as

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        if indexPath.section %2 == 0 {
            let cell1 = tableView.dequeueReusableCell(withIdentifier: "cell1", for: indexPath) as? FirstCell
            cell1.lbl1.text = datalist1[indexPath.row]
            return cell1!
        }
        else {
            let cell2 = tableView.dequeueReusableCell(withIdentifier: "cell2", for: indexPath) as? SecondCell            
            cell2.lbl2.text = datalist2[indexPath.row]
            return cell2!
        }

    }

score 0 · Answer 4 · answered Jun 21 '19 at 07:51

The best way is using models. You have to declare data model such as

struct MyModel {
   var firstValue: String?
   var secondValue: String?
}

Then you have to convert your two arrays to a single array of MyModel objects

var myData = Array<MyModel>()

Then by using for loop you can iterate over one array and fill the myData array.

for (index, _) in datalist1 {
   let object = MyModel()
   object.firstValue = datalist1[index]
   object.firstValue = datalist2[index]
   myData.append(object)
}

Then just implement tableview protocol methods and fill your custom cell with MyModel objects.

score 0 · Answer 5 · answered Jun 21 '19 at 08:01

1. Create a single array from datalist1 and datalist2 using zip(_:_:), that we'll be using as dataSource for tableView.

lazy var dataList = Array(zip(self.datalist1, self.datalist2))

dataList is of type [(String, String)].

Example:

If datalist1 and datalist2 are,

let datalist1 = ["firstCell1" , "firstCell2" , "firstCell3" , "firstCell4"]
let datalist2 = ["secondCell1"  ,"secondCell2" , "secondCell3" ,"secondCell4"]

then, dataList contains

[("firstCell1", "secondCell1"), ("firstCell2", "secondCell2"), ("firstCell3", "secondCell3"), ("firstCell4", "secondCell4")]

2. You need a single cell to display all that data. There is no need to create 2 different UITableViewCells for this. Example:

class CustomCell: UITableViewCell {
    @IBOutlet weak var lbl1: UILabel!
    @IBOutlet weak var lbl2: UILabel!
}

3. Now, your UITableViewDataSource methods look like,

func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return dataList.count
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! CustomCell
    cell.lbl1.text = self.dataList[indexPath.row].0
    cell.lbl2.text = self.dataList[indexPath.row].1
    return cell
}

How to fill tableview with two arrays using single custom cell?

5 Answers5