设计UITableView / Cell - iOS

时间:2017-03-08 20:46:46

标签: ios iphone uitableview design-patterns tableviewcell

我正在使用子视图设计一个UITableView来填充它的可重用单元格,我希望对此有所了解。 正如我测试的那样,它运作良好。但是,我不知道这是不是一个好的解决方案。

场景是:我有一个包含不同类型单元格(布局)的tableview。当我设计时,它会快速增长(我的控制器代码),因为我必须注册很多单元格并处理cellForRow。然后我提出这个想法,为一个独特的可重用单元格实例化不同的子视图,并使用'Presenter'来处理委托/数据源。你认为这是一个问题吗?这是一个好方法吗?

提前致谢!

Ps。抱歉任何英语错误!

编辑:

这是项目中的会话,后跟de代码: bundle image

代码:

  • OrderDetailCell

    class OrderDetailCell: UITableViewCell {
    
    //MARK: Outlets
    @IBOutlet weak var cellHeight: NSLayoutConstraint!
    @IBOutlet weak var viewContent: UIView!
    
    //Variables
    var didUpdateLayout = false
    
    
    internal func setupLayoutWith(view: UIView){
    cellHeight.constant = view.frame.height
    viewContent.frame = view.frame
    
    viewContent.addSubview(view)
    
    updateConstraints()
    layoutIfNeeded()
    
    didUpdateLayout = true
     }
    }
    
  • OrderDetailSubview

    class OrderDetailSubview: UIView {
    
    var type: OrderDetailsSubViewType?
    var height: CGFloat = 1
    
    class func instanceFromNib(withType type: OrderDetailsSubViewType) -> OrderDetailSubview {
    let view = UINib(nibName: type.rawValue, bundle: nil).instantiate(withOwner: nil, options: nil)[0] as! OrderDetailSubview
    
    switch type {
    case .OrderDetailSubviewStatus:
        view.height = 258
    
    case .OrderDetailSubViewItem:
        view.height = 129
    
    case .OrderDetailSubViewStoreInformation:
        view.height = 317
    
    case .OrderDetailSubViewEvaluation:
        view.height = 150
    }
    
    view.updateConstraints()
    view.layoutIfNeeded()
    
    return view
     }
    }
    
  • OrderDetailPresenter

    enum OrderDetailsSubViewType: String {
    
    case OrderDetailSubviewStatus = "OrderDetailSubviewStatus",
    OrderDetailSubViewItem = "OrderDetailSubViewItem",
    OrderDetailSubViewStoreInformation = "OrderDetailSubViewStoreInformation",
    OrderDetailSubViewEvaluation = "OrderDetailSubViewEvaluation"
    
     static let types = [OrderDetailSubviewStatus, OrderDetailSubViewItem, OrderDetailSubViewStoreInformation, OrderDetailSubViewEvaluation]
      }
    
    class OrderDetailPresenter {
    
     //Constants
     let numberOfSections = 4
    
    //Variables
    //    var order: Order?
    
     func setup(reusableCell: UITableViewCell, forRowInSection section: Int) -> OrderDetailCell {
    
    let cell = reusableCell as! OrderDetailCell
    for sub in cell.viewContent.subviews {
        sub.removeFromSuperview()
       }
    
      let subView = OrderDetailSubview.instanceFromNib(withType: OrderDetailsSubViewType.types[section])
    cell.setupLayoutWith(view: subView)
    
    return cell
    
    }
    
    func numberOfRowsForSection(_ section: Int) -> Int {
    switch section {
    case 1:
        //TODO: count de offerList
        return 4
    default:
        return 1
      }
     }
    }
    
  • OrderDetailViewController

    class OrderDetailViewController: BaseViewController {
    
    //MARK: Outlets
    @IBOutlet weak var tableView: UITableView!
    
    var presenter = OrderDetailPresenter()
    
    override func setupView() {
      setupTableView()
    
       }
     }
    
    
    extension OrderDetailViewController: UITableViewDataSource, UITableViewDelegate {
    
    internal func setupTableView() {
    
    tableView.delegate = self
    tableView.dataSource = self
    tableView.estimatedRowHeight = 600
    tableView.rowHeight = UITableViewAutomaticDimension
    
    tableView.register(UINib(nibName: "OrderDetailCell", bundle: nil), forCellReuseIdentifier: "OrderDetailCell")
    
    }
    
    func numberOfSections(in tableView: UITableView) -> Int {
     return presenter.numberOfSections
    }
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return presenter.numberOfRowsForSection(section)
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    
    let reusableCell = tableView.dequeueReusableCell(withIdentifier: "OrderDetailCell") as! OrderDetailCell
    
    let cell = presenter.setup(reusableCell: reusableCell, forRowInSection: indexPath.section)
    
    
    return cell
    
     }
    }
    

*对不起这里的缩进...

多数民众赞成!你怎么想?

2 个答案:

答案 0 :(得分:1)

在这里,您希望有多个UITableViewCell子类来实现所需的不同布局,然后在表视图数据源中选择相关的子类。

class Cell1: UITableViewCell {

    let label = UILabel()

    override init(style: UITableViewCellStyle, reuseIdentifier: String) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        self.contentView.addSubview(label)
    }

    ... whatever other setup/layout you need to do in the class ...

}

class Cell2: UITableViewCell {

    let imageView = UIImageView()

    override init(style: UITableViewCellStyle, reuseIdentifier: String) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        self.contentView.addSubview(imageView)
    }

    ... whatever other setup/layout you need to do in the class ...

}

然后在你的视图控制器中

override func viewDidLoad() {
    super.viewDidLoad()
    tableView.register(Cell1.self, forCellReuseIdentifier: "cell1Identifier")
    tableView.register(Cell2.self, forCellReuseIdentifier: "cell2Identifier")
}

...

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    if indexPath.row % 2 == 0 { // just alternating rows for example
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell1Identifier", for: indexPath) as! Cell1
        // set data on cell
        return cell
    } else {
        let cell = tableView.dequeueReusableCell(withIdentifier: "cell2Identifier", for: indexPath) as! Cell2
        // set data on cell
        return cell
    }
}

所以这只是一个例子,但在表视图中使用两个不同的单元子类来交替行。

答案 1 :(得分:0)

let dynamicCellID: String = "dynamicCellID" //One Cell ID for resuse
class dynamicCell: UITableViewCell {

    var sub: UIView // you just need to specify the subview

    init(sub: UIView) {
        self.sub = sub
        super.init(style: .default, reuseIdentifier: dynamicCellID)

        self.addSubview(sub)
        self.sub.frame = CGRect(x: 0, y: 0, width: sub.frame.width, height: sub.frame.height)
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

}

您需要创建一个视图数组,将该视图提供给委托中的每个单元格

let views: [UIView] = []

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

                    return views.count
    }

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

                    let v = views[indexPath.row]
                    return dynamicCell(sub: v)
    }

    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {

                    let v = views[indexPath.row]
                    return v.frame.height + 10 //offset is 10 point
    }