时间戳

首页 > 解决方案 > 如何将单元格分成带有自定义标题的部分？

ios - 如何将单元格分成带有自定义标题的部分？

问题描述

我想做的是按他们的品牌将我的单元格分成几个部分

到目前为止，我能够做的是从 HomeVC 传递所选项目的数据以填充 CartVC 的单元格

我试图按品牌分隔部分，品牌数据是模型项目类（名称、品牌、imageUrl、价格和重量）的一部分，项目类从 CloudFirestore 检索数据以填充 HomeVC 的单元格

当传递到 CartVC 时，我如何能够按其品牌将单元格分成多个部分。

到目前为止，我所做的似乎失败了，因为一旦我将一个项目从 HomeVC 传递到 CartVC，我只会得到一个标题单元格，其中包含我传递给 CartVC 的第一个项目的品牌名称。当我将更多数据传递到 CartVC 时，所有单元格都停留在第一个项目的部分中，当我试图按他们的品牌划分我的所有 CartCells 时

 extension HomeViewController: UITableViewDelegate, UITableViewDataSource {

    func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return itemSetup.count
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        guard let cell = tableView.dequeueReusableCell(withIdentifier: "HomeCell") as? HomeCell else { return UITableViewCell() }

        let item = itemSetup[indexPath.row]
        cell.configure(withItems: item)
        cell.addActionHandler = { (option: Int) in
            print("Option selected = \(option)")
            self.tray.append(Tray(cart: item))
            item.selectedOption = option
        }

        return cell
    }

}

class CartViewController: UIViewController {

    var items: ProductList!
    var sectionModel: [SectionModel] = []
    var tray: [Tray] = []

    var groupedItems: [String: [Tray]] = [:]
    var brandNames: [String] = []

    @IBOutlet weak var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()

         groupedItems = Dictionary(grouping: tray, by: {$0.cart.brand})
         brandNames = groupedItems.map{$0.key}.sorted()
    }

}

extension CartViewController: UITableViewDataSource, UITableViewDelegate {

    func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }

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

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "CartCell", for: indexPath) as! CartCell

        let cart = tray[indexPath.row]
        cell.configure(withItems: cart.cart)

        return cell
    }

    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let cartHeader = tableView.dequeueReusableCell(withIdentifier: "CartHeader") as! CartHeader

        cartHeader.storeName.text = "Brand: \(tray[section].cart.brand)"
        return cartHeader
    }

    func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 45
    }
}

class Tray {
    var cart: ProductList!

    init(cart: ProductList) {

        self.cart = cart
    }
}

标签： iosswiftiphoneuitableviewuitableviewsectionheader

解决方案

只需设置您的表格视图功能，您就可以按部分进行设置

   func numberOfSections(in tableView: UITableView) -> Int {
        return brandNames.count
    }

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        let brand = brandNames[section]
        return groupedItems[brand]!.count
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cartCell = tableView.dequeueReusableCell(withIdentifier: "CartCell") as! CartCell

        let brand = brandNames[indexPath.section]
        let itemsToDisplay = groupedItems[brand]![indexPath.row]
        cartCell.configure(withItems: itemsToDisplay.cart)

        return cartCell
    }

    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let cartHeader = tableView.dequeueReusableCell(withIdentifier: "CartHeader") as! CartHeader

        let headerTitle = brandNames[section]
        cartHeader.brandName.text = "Brand: \(headerTitle)"

        return cartHeader
    }

推荐阅读