简体   繁体   中英

Binding JSON data to TableView and CollectionView

I am trying to create a table view with a collection view in each cell. My JSON structure is like Main Menu title for the tv cell and in each main object, I receive a submenu, whose data I want to use in the collection view.

The issue I am facing is in using indexes of table cell and collection cell to get the nested data. Here is my JSON

  "MainMenu": [
    {
      "ID": 8,
      "MasterID": 12,
      "Title": "Payment",
      "Image": "image.png",
      "SubMenu": [
        {
          "ID": 9,
          "Title": "My Bill",
          "Image": "image.png"
        },
        {
          "ID": 10,
          "Title": "Electricity ",
          "Image": "image.png"
        },
        {
          "ID": 11,
          "Title": "Gas",
          "Image": "image.png"
        },
        {
          "ID": 12,
          "Title": "Telephone",
          "Image": "image.png"
        },
        {
          "ID": 13,
          "Title": "Water",
          "Image": "image.png"
        }
      ]
    },
    {
      "ID": 40,
      "MasterID": 14,
      "Title": "Services",
      "Image": "image.png",
      "SubMenu": [
        {
          "ID": 32,
          "Title": "Upload Slip",
          "Image": "image.png"
        },
        {
          "ID": 41,
          "Title": "SRY (Self Reliant Youth)",
          "Image": "image.png"
        },
        {
          "ID": 42,
          "Title": "Dollor Product Purchase ",
          "Image": "image.png"
        },
        {
          "ID": 43,
          "Title": "ARY Coin Redemption",
          "Image": "image.png"
        },
        {
          "ID": 44,
          "Title": "Pay Via QR",
          "Image": "image.png"
        },
        {
          "ID": 45,
          "Title": "Card Request",
          "Image": "image.png"
        }
      ]
    },
    {
      "ID": 14,
      "MasterID": 8,
      "Title": "Mobile Balance",
      "Image": "image.png",
      "SubMenu": [
        {
          "ID": 15,
          "Title": "My Mobile",
          "Image": "image.png"
        },
        {
          "ID": 16,
          "Title": "Mobilink",
          "Image": "image.png"
        },
        {
          "ID": 17,
          "Title": "Telenor",
          "Image": "image.png"
        },
        {
          "ID": 18,
          "Title": "Ufone",
          "Image": "image.png"
        },
        {
          "ID": 19,
          "Title": "Warid",
          "Image": "image.png"
        },
        {
          "ID": 20,
          "Title": "Zong",
          "Image": "image.png"
        }
      ]
    },
    {
      "ID": 46,
      "MasterID": 6,
      "Title": "Help",
      "Image": "image.png",
      "SubMenu": [
        {
          "ID": 47,
          "Title": "Call",
          "Image": "image.png"
        },
        {
          "ID": 48,
          "Title": "Chat",
          "Image": "image.png"
        },
        {
          "ID": 49,
          "Title": "Email",
          "Image": "image.png"
        },
        {
          "ID": 50,
          "Title": "Others",
          "Image": "image.png"
        },
        {
          "ID": 51,
          "Title": "VAS / SMS",
          "Image": "image.png"
        }
      ]
    },
    {
      "ID": 21,
      "MasterID": 5,
      "Title": "Fund Transfer",
      "Image": "image.png",
      "SubMenu": [
        {
          "ID": 22,
          "Title": "To Other ARY Wallet",
          "Image": "image.png"
        },
        {
          "ID": 23,
          "Title": "To Bank Account",
          "Image": "image.png"
        }
      ]
    },
    {
      "ID": 34,
      "MasterID": 1,
      "Title": "$ & MilliGold Deal",
      "Image": "image.png",
      "SubMenu": [
        {
          "ID": 35,
          "Title": "$ Deposit",
          "Image": "image.png"
        },
        {
          "ID": 36,
          "Title": "$ Purchase",
          "Image": "image.png"
        },
        {
          "ID": 37,
          "Title": "$ Time Games",
          "Image": "image.png"
        },
        {
          "ID": 38,
          "Title": "Scan for Bid",
          "Image": "image.png"
        }
      ]
    }
  ],
  "CustomerAccountInformation": []
}

Please guide me how can I use my JSON objects each in different tablecell. Here is what I have tried:

TVCell
cell.titleLabel.text = menu?.mainMenu?[indexPath.row].title ?? "Our services"

CollectionCell
cell.image.af_setImage(withURL: URL.init(string: (menu?.mainMenu?[indexPath.row].subMenu?[indexPath.row].image)!)!)

First, in your tableview cell, set the tag of the collectionview to indexPath.row

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell : TVCell = tableview.dequeueReusableCell(withIdentifier: "TVCell", for: indexPath) as! TVCell
cell.myCollectionView.tag = indexPath.row
    return cell
}

Now in your collectionview cell you can parse the data like following

let index = cell.tag
cell.image.af_setImage(withURL: URL.init(string: (menu?.mainMenu?[index].subMenu?[indexPath.row].image)!)!)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM