如何使用UITableViews使用Swift创建静态和动态行

时间:2017-06-05 00:34:56

标签: ios swift uitableview

这个问题的后续跟进:Use UICollectionViews to create dynamic and multiple features

我能够创建一个静态单元格,显示与此应用程序类似的配方名称和图像:

enter image description here

我陷入困境的是创建一个动态行,该行根据内部数据量(例如器具或营养价值)而变化,如下图所示:

enter image description here

我知道如何在tableView上正常显示数据行。但不确定如何将其嵌入tableView内的一个部分。我试图添加多个原型单元格并将它们分配给UITableViewCell的子类。然后我尝试在if中使用cellForRow语句,但这并不能解决我的问题。

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

    if indexPath.row == 0 {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! FirstCell
        //set the data here

        cell.recipeTitle.text = recipe.name
        cell.imageView.image = UIImage(named: "url")
        return cell
    }
    else if indexPath.row == 1 {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell2", for: indexPath) as! SecondCell
        //set the data here
        return cell
    }
    else {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell3", for: indexPath) as! ThirdCell
        //set the data here
        return cell
    }
}

我也看过这个演示:https://medium.com/ios-os-x-development/ios-how-to-build-a-table-view-with-multiple-cell-types-2df91a206429,它接近我想要达到的目标,但我发现它很难适应它。

如果有人可以指导我如何最好地接近这个或一个好的例子,那么我真的很感激。

1 个答案:

答案 0 :(得分:1)

首先,您不能在同一个tableView中拥有静态单元格和动态单元格。那你怎么解决这个问题呢?定义它们所属的部分中的每个静态单元以及它们所属的部分中的动态单元。然而,这看起来并不像你想要做的那样。您只需要在同一个tableView中有多个部分,每个部分都有不同的数据列表

为此,您需要多个部分,因此请使用tableView(_:numberOfSections :)函数。

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

然后你可以(并且可能应该)通过在tableViewController中初始化带有标题的数组来给每个部分一个标题(假设你正在使用它。它也可以只是一个tableView)。

let headerTitles = ["Nutritional Values", "Utensils", "Ingredients"]

然后使用tableView(_:titleForHeaderInSection:)

override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    if section < headerTitles.count {
        return headerTitles[section]
    }
    return nil
}

现在,您可以按部分开始定义行。

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

    if indexPath.section == 0 {
        //Setup up the first row
        if indexPath.row == 0 {
            //I'm not sure where or how you defined First/SecondCell but this may not work depending on those two questions.
            let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! FirstCell                
            return cell
        } else if indexPath.row == 1 {
            let cell = Bundle.main.loadNibNamed("StaticCell", owner: self, options: nil)?.first as! StaticCell
            return cell
        }

    } else if indexPath.section == 1 {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell1", for: indexPath) as! SecondCell  
        //setup cell1 n your storyboard to have a label with a tag # of 12(or whatever number you want to use)
        //you also want an array with your utensil data accessible here
        let label = cell.viewWithTag(12) as! UILabel
        label.text = utensilNames[indexPath.row]              
            return cell

    } else if indexPath.section == 2 {
        let cellIngredients = tableView.dequeueReusableCell(withIdentifier: "Ingredients", for: indexPath)

        tableView.deselectRow(at: indexPath, animated: true)
        return cellIngreidents
    }
    cell = tableView.dequeueReusableCell(withIdentifier: "cell")!
    return cell
}

这里的要点是使用部分然后行来分发数据。

只是为了澄清第0节第0行 - N将是您设置静态行的位置。我发现最好使用子类化TableViewCell的XIB文件。 希望这会有所帮助。

编辑因此,我正在查看“静态”单元格的方式是在第一部分中,xib是唯一准确放置在您告诉它放置的位置。在上面的示例中,第二个单元格中的第一部分是