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

前端之家收集整理的这篇文章主要介绍了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相关文章