swift开发笔记16 - 使用xib自定义一个控件(复合控件)

在之前的文章：《swift开发笔记10 －通过drawRect自定义控件外观》中介绍了如何自定义一个按钮控件的外观。

新的问题是，我怎么做一个复合控件，比如一个label和一个button构成一个控件，并可以在静态表格的单元格中重用呢，并且我不想用纯代码的方式来做这个复合控件

参考文章 iOS swift使用xib绘制UIView找到了解决办法。

首先说下在storyboard中使用静态表格做的界面布局：

在静态表格中类似“个人资料”中单元格的定义可以通过直接拖拽控件的方式完成，但是像评价这栏的单元格是动态生成的，数目不固定，并且每行的内容类似，最好是能用一个复合控件来填充。

首先建一个xib文件：

然后拖一个table view cell 到xib中，然后拖label和按钮，并设置布局：

注意“五角星”按钮有select状态，其image是红五角星，表示选中

然后给这个单元格xib命名：oneRizhiListCell

然后为这个复合控件建立Cocoa Touch class文件，这个文件继承UITableViewCell，并在xib的class属性中选择该类，最后如下所示：

然后右键拖拽label和button到class中，建立outlets，并处理按钮的选中事件：

import UIKit

class oneRizhiCellView: UITableViewCell {

    @IBOutlet weak var NameLabel: UILabel!
    @IBOutlet weak var isOkButton: UIButton!
    
    
    
    override func drawRect(rect: CGRect) {
        // Drawing code
         isOkButton.addTarget(self,action: "buttonSelected:",forControlEvents: UIControlEvents.TouchUpInside)
        //也可以通过代码添加控件
        //self.addSubview(<#T##view: UIView##UIView#>)
    }
    
    func buttonSelected(button: UIButton) {
        
        button.selected = !button.selected
    }
}

至此用xib自定义复合控件就做完了，然后再表格中这么用：

 
    override func tableView(tableView: UITableView,cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
       // let cell = tableView.dequeueReusableCellWithIdentifier("reuseIdentifier",forIndexPath: indexPath)
        let cell=super.tableView(tableView,cellForRowAtIndexPath: indexPath)
        cell.selectionStyle = UITableViewCellSelectionStyle.None
        
        switch (indexPath.section) {
        case 1:
            //日志
          
          let myView = NSBundle.mainBundle().loadNibNamed("oneRizhiListCell",owner: nil,options: nil).first as? UIView
          
          myView?.frame = CGRect(x: 0,y: 0,width: cell.frame.width,height:  40)
          //myView?.center = self.view.center
          
          if myView != nil {
            cell .contentView.addSubview(myView!)
          }
            
        case 2:
           
            //考勤

最后效果：

当然还没完，要想使这个静态表格像动态表格一样增加行数，还要调用insertRowsAtIndexPaths方法，或者override 它的

public func tableView(tableView: UITableView,cellForRowAtIndexPath indexPath: NSIndexPath)才行

swift开发笔记16 - 使用xib自定义一个控件(复合控件)

相关文章