Swift编程(一):UITableView及自定义Cell的Xib

学习目标:

  • 使用纯代码创建任意自定义的UITableViewCell
  • 使用纯代码创建UITableView并调用UITableViewCell

步骤

  1. 创建一个UITableViewCell(并创建xib)命名为 DemoListCell

创建Cell


1) 在DemoListCell.xib中画出你想要的cell样式(AutoLayout),另外注意要给Cell制定 IdentityId: DemoListID


设置CellId


2) 我这里创建了两个UIImage,一个UILabel (图片我会后续补上)


创建布局控件

3) 从UIDemoListCell.xib 向 UIDemoListCell.swift 划线(右键选择控件不放拖到.swift文件中放手并命名),Cell样式的初始化就完成了,接下来我们需要调用。代码如下:

swift
@IBOutlet weak var cellImg: UIImageView!
@IBOutlet weak var cellLabel: UILabel!
@IBOutlet weak var cellIcon: UIImageView!

注释:图片我会后续补上去

  1. 调用自定义的UITableViewCell
    1) 创建数据源和CellId

    swift
    let cellId = "DemoListID" //获取CellId
    var tableData: (titles:[String], values:[String])? //定义一个数据源

    2) 在viewDidLoad中使用代码创建一个UITableView
    swift
    override func viewDidLoad() {
         super.viewDidLoad()
         self.title = "主页"
         self.view.backgroundColor = UIColor.whiteColor()
    
         //demoList的设置
         self.demoList.frame = CGRectMake(0, 0, self.view.frame.width, self.view.frame.height)
         //下面代码是用来去掉UITableView的Cell之间的线
         //self.demoList.separatorStyle = UITableViewCellSeparatorStyle.None
         let nib = UINib(nibName: "DemoListCell", bundle: nil) //nibName指的是我们创建的Cell文件名
         self.demoList.registerNib(nib, forCellReuseIdentifier: cellId)
         self.demoList.delegate = self
         self.demoList.dataSource = self
         self.view.addSubview(self.demoList)
         self.showData()
     }
  2. 展示数据源,这里我就写一个静态数据作为数据源即可
    swift
    func showData()
     {
         self.tableData = (["SLC提示组件", "SwiftNotice组件--JohnLui", "CNPPopup组件","闭包回调","KLCPopup组件","Pitaya网络组件","Neon布局组件"], ["SCLAlert", "SwiftNotice", "CNPPopup","ClosureBack","","",""])
         self.demoList.reloadData()
    }
  3. 既然使用了UITableView那么就必须要使用注意到有些必须的代理需要重写,其实我们可以去UITableView中查看,没有 optional开头的function都是必须重写
    1) 这里我们重写 这里我们重写四个,代码如下:

    swift
    func numberOfSectionsInTableView(tableView: UITableView) -> Int {
         return 1
     }
    
     func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    
         guard let count:Int = self.tableData!.titles.count else {
             print("没有数据")
         }
    
         return count
     }
     func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
         let cell = tableView.dequeueReusableCellWithIdentifier(self.cellId, forIndexPath: indexPath) as! DemoListCell
         //cell.cellImg.image = UIImage(named: powerData[indexPath.row][2])
         cell.cellLabel.text = self.tableData!.titles[indexPath.row]
    
         return cell
     }
    
     func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath)
     {
         let index = indexPath.row
         let storyID = tableData!.values[index] as String
         let storyboard = UIStoryboard(name: "Main", bundle: nil)
         var nextView:UIViewController
         switch storyID {
         case "SCLAlert":
             nextView = storyboard.instantiateViewControllerWithIdentifier(storyID) as! SCLAlertDemoViewController
         case "SwiftNotice":
             nextView = storyboard.instantiateViewControllerWithIdentifier(storyID) as! SwiftNoticeDemoViewController
         case "CNPPopup":
             nextView = storyboard.instantiateViewControllerWithIdentifier(storyID) as! CNPPopupDemoViewController
         case "ClosureBack":
             nextView = LWRootViewController()
         default:
             nextView = storyboard.instantiateViewControllerWithIdentifier("SCLAlert") as! SCLAlertDemoViewController
         }
         self.navigationController?.pushViewController(nextView, animated: true)
     }
    
     func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat
     {
         return 50
     }

注意事项:

既然创建了UITableView,需要在Class继承后面加上Delegate和DataSource

swift
class MainViewController: UIViewController,UITableViewDelegate,UITableViewDataSource

总结:

这样我们就成功创建了一个纯代码创建的UITableView以及调用了自定义的Cell,是不是很简单!
下面就是效果图(我的GitHub


原文链接:http://www.jianshu.com/p/150ba0779cc0

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值