带有多个 Swift 自定义单元格的 UITableview [英] UITableview with more than One Custom Cells with Swift

问题描述

我想使用具有不同自定义 tableViewCells 的 UITableview.我的 3 个单元格是这样的:

I want to use a UITableview with different custom tableViewCells. My 3 cells are as such:

• Cell1:应该有一个图像和一个标签.
• Cell2:应该有两个标签.
• Cell3:应该有一个 dayPicker.

我不想为单元格编码标签.我如何在 Swift 中管理这个.我是否必须为每个单元格编写自己的类?我可以使用一个 tableviewController 吗?如何在不同的单元格中填充数据?

I don't want to code a tag for the cells. How can I manage this in Swift. Do I have to code my own class for every cell? Can I use one tableviewController? How can I populate data in different cells?

我想生成一个tableView，就像iOS设备的联系人应用.

I would like to generate a tableView, like a contact app of an iOS device.

推荐答案

让我先回答你的问题.

我是否必须为每个单元格编写一个自己的类?=> 是的，我相信是这样.至少，我会那样做.

Do I have to code an own class for every cell?=> Yes, I believe so. At least, I would do that way.

我可以使用一个 tableviewController 吗?=> 可以.但是，您也可以在您的视图控制器中拥有一个表格视图.

Can I use one tableviewController?=> Yes, you can. However, you can also have a table view inside your View Controller.

如何在不同的单元格中填充数据?=> 根据条件，您可以在不同的单元格中填充数据.例如，假设您希望前两行类似于第一种类型的单元格.因此，您只需创建/重用第一种类型的单元格并设置它的数据.我想，当我向您展示屏幕截图时，会更清楚.

How can I populate data in different cells? => Depending on the conditions, you can populate data in different cells. For example, let's assume that you want your first two rows to be like the first type of cells. So, you just create/reuse first type of cells and set it's data. It will be more clear, when I show you the screen shots, I guess.

让我举一个在 ViewController 中包含 TableView 的示例.一旦你理解了主要概念，那么你就可以随意尝试和修改.

Let me give you an example with a TableView inside a ViewController. Once you understand the main concept, then you can try and modify anyway you want.

第 1 步:创建 3 个自定义 TableViewCell.我将它命名为 FirstCustomTableViewCell、SecondCustomTableViewCell、ThirdCustomTableViewCell.您应该使用更有意义的名称.

Step 1: Create 3 Custom TableViewCells. I named it, FirstCustomTableViewCell, SecondCustomTableViewCell, ThirdCustomTableViewCell. You should use more meaningful names.

第 2 步:转到 Main.storyboard 并将 TableView 拖放到您的视图控制器中.现在，选择表视图并转到身份检查器.将Prototype Cells"设置为 3.在这里，您只是告诉您的 TableView 您可能有 3 种不同类型的单元格.

Step 2: Go the Main.storyboard and drag and drop a TableView inside your View Controller. Now, select the table view and go to the identity inspector. Set the "Prototype Cells" to 3. Here, you just told your TableView that you may have 3 different kinds of cells.

第 3 步:现在，在 TableView 和身份检查器中选择第一个单元格，将FirstCustomTableViewCell"放在自定义类字段中，然后在属性检查器中将标识符设置为firstCustomCell".

Step 3: Now, select the 1st cell in your TableView and in the identity inspector, put "FirstCustomTableViewCell" in the Custom class field and then set the identifier as "firstCustomCell" in the attribute inspector.

对所有其他人做同样的事情 - 将他们的自定义类分别设置为SecondCustomTableViewCell"和ThirdCustomTableViewCell".还要将标识符连续设置为 secondCustomCell 和thirdCustomCell.

Do the same for all others- Set their Custom Classes as "SecondCustomTableViewCell" and "ThirdCustomTableViewCell" respectively. Also set the identifiers as secondCustomCell and thirdCustomCell consecutively.

第 4 步:编辑自定义单元格类并根据需要添加插座.我根据你的问题编辑了它.

Step 4: Edit the Custom Cell Classes and add outlets according to your need. I edited it based on your question.

P.S:您需要将插座放在类定义下.

P.S: You need to put the outlets under the class definition.

所以，在 FirstCustomTableViewCell.swift 中，

So, In the FirstCustomTableViewCell.swift, under the

class FirstCustomTableViewCell: UITableViewCell {

你会放置你的标签和图像视图插座.

you would put your label and image view outlets.

 @IBOutlet weak var myImageView: UIImageView!
 @IBOutlet weak var myLabel: UILabel!

在 SecondCustomTableViewCell.swift 中，添加两个标签，如-

and in the SecondCustomTableViewCell.swift, add the two labels like-

import UIKit

class SecondCustomTableViewCell: UITableViewCell {

    @IBOutlet weak var myLabel_1: UILabel!
    @IBOutlet weak var myLabel_2: UILabel!

    override func awakeFromNib() {
        super.awakeFromNib()
    }

    override func setSelected(selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
}

并且 ThirdCustomTableViewCell.swift 应该看起来像-

and the ThirdCustomTableViewCell.swift should look like-

import UIKit

class ThirdCustomTableViewCell: UITableViewCell {

    @IBOutlet weak var dayPicker: UIDatePicker!

    override func awakeFromNib() {
        super.awakeFromNib()
    }

    override func setSelected(selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
}

第 5 步:在您的 ViewController 中，为您的 TableView 创建一个 Outlet 并设置故事板的连接.此外，您需要在类定义中添加 UITableViewDelegate 和 UITableViewDataSource 作为协议列表.所以，你的类定义应该看起来像-

Step 5: In your ViewController, create an Outlet for your TableView and set the connection from storyboard. Also, you need to add the UITableViewDelegate and UITableViewDataSource in the class definition as the protocol list. So, your class definition should look like-

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

之后，将表视图的 UITableViewDelegate 和 UITableViewDatasource 附加到控制器.此时你的 viewController.swift 应该看起来像 -

After that attach the UITableViewDelegate and UITableViewDatasource of your table view to your controller. At This point your viewController.swift should look like-

import UIKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    @IBOutlet weak var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

P.S:如果您要在 ViewController 中使用 TableViewController 而不是 TableView，您可以跳过这一步.

P.S: If you were to use a TableViewController rather than a TableView inside a ViewController, you could have skipped this step.

第 6 步:根据 Cell 类将图像视图和标签拖放到您的单元格中.然后从故事板提供到他们的网点的连接.

Step 6: Drag and drop the image views and labels in your cell according to the Cell class. and then provide connection to their outlets from storyboard.

第 7 步:现在，在视图控制器中编写 UITableViewDatasource 所需的方法.

Step 7: Now, write the UITableViewDatasource's required methods in the view controller.

import UIKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    @IBOutlet weak var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()
    }

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

    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 3
    }

    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        if indexPath.row == 0 {
            let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "firstCustomCell")
            //set the data here
            return cell
        }
        else if indexPath.row == 1 {
            let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "secondCustomCell")
            //set the data here
            return cell
        }
        else {
            let cell: UITableViewCell = UITableViewCell(style: UITableViewCellStyle.Default, reuseIdentifier: "thirdCustomCell")
            //set the data here
            return cell
        }
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

这篇关于带有多个 Swift 自定义单元格的 UITableview的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！