Swift基础之UITableView与UICollectionView

前面大脸猫简单的介绍了滚动视图UIScrollView的属性与代理,下面我们来看一下UITableView和UICollectionView的区别与联系。

一、UITableView的属性和代理

首先我们来创建一个tableView:

 var tableView:UITableView?
  //创建表格式图,两种样式
 self.tableView = UITableView(frame: self.view.frame ,style: UITableViewStyle.Plain)//无格式
 //self.tableView = UITableView(frame: self.view.frame,style:UITableViewStyle.Grouped)//分组格式
设置tableView允许多选:
  self.tableView.allowsMultipleSelection = true

UITableView中每行数据都是一个UITableViewCell,在这个控件中为了显示更多的信息,iOS已经在其内部设置好了多个子控件以供开发者使用。如果我们查看UITableViewCell的声明文件可以发现在内部有一个UIView控件(contentView,作为其他元素的父控件)、两个UILable控件(textLabel、detailTextLabel)、一个UIImage控件(imageView),分别用于容器、显示内容、详情和图片。

既然我们要用tableView,当然要设置代理,遵循协议UITableViewDelegate,UITableViewDataSource啦,在我们遵循上面两个协议的时候,有些小伙伴可能会说,怎么报错了呢?o(╯□╰)o
报错原因呢是因为在使用UITableViewDataSource, UITableViewDelegate两个协议时,必须要实现几个tableView方法 解决办法: 在ViewController中实现一下三个方法: 当实现了前两个方法后,Xcode就不提示这个错误了。
 self.tableView!.delegate = self
 self.tableView!.dataSource = self
创建一个重用的单元格
 self.tableView!.registerClass(UITableViewCell.self, forCellReuseIdentifier: "SwiftCell")
实现代理方法
//一个分区
func numberOfSectionsInTableView(tableView: UITableView) -> Int {
    return 1;
}
//返回表格行数
func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 10;
}
//创建各单元格显示内容(创建参数indexPath制定单元)
func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
    //为了提供表格显示性能,以创建完成的单元需要重复使用
    let identify:String = "SwiftCell"
    //同一形式的单元格重复使用,在声明时已经注册
    let cell = tableView.dequeueReusableCellWithIdentifier(identify,forIndexPath: indexPath) as UITableViewCell
    //设置cell的选中背景颜色
    cell.selectedBackgroundView = UIView()
    cell.selectedBackgroundView?.backgroundColor = UIColor(red: 135/255, green: 191/255, blue: 49/255, alpha: 1)
    //默认文字颜色是黑色,选中项文字是白色
    cell.textLabel?.textColor = UIColor.blackColor()
    cell.textLabel?.highlightedTextColor = UIColor.whiteColor()

    return cell
}
//UITableDelegate方法,处理列表项的选中事件
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
    self.tableView!.deselectRowAtIndexPath(indexPath, animated: true)
    let itemString = self.ctrlnames![indexPath.row]
    let alertControl = UIAlertController(title: "提示", message: "你选中了【\(itemString)】", preferredStyle: UIAlertControllerStyle.Alert)
    let okAction = UIAlertAction(title: "确定", style: UIAlertActionStyle.Default, handler: nil )
    alertControl.addAction(okAction)
    self.presentViewController(alertControl, animated: true, completion: nil )
}
//滑动删除必须实现的方法
func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
    print("删除\(indexPath.row)") 
}
//滑动删除
func tableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCellEditingStyle {
    return UITableViewCellEditingStyle.Delete
}
//设置删除按钮的文字
func tableView(tableView: UITableView, titleForDeleteConfirmationButtonForRowAtIndexPath indexPath: NSIndexPath) -> String? {
    return "删";
}
//设置每行高度
func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
    return 50;
}
//设置分组标题内容高度
func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return 100;
}
//设置尾部说明内容高度
func tableView(tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
    return 50;
}
//返回每组头标题名称
func tableView(tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
    return "头标题"
}
//返回每组尾标题名称
func tableView(tableView: UITableView, titleForFooterInSection section: Int) -> String? {
    return "尾标题"
}
//返回每组标题索引
func sectionIndexTitlesForTableView(tableView: UITableView) -> [String]? {
    return ["1","2"]
}
//点击行时调用
func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
    
}

二、UICollectionView的属性和代理

首先我们来创建一个collectionView:

  var collectionView:UICollectionView?
  let layout = UICollectionViewFlowLayout()
  self.collectionView = UICollectionView(frame: CGRectMake(0, 20, view.bounds.size.width, view.bounds.size.height), collectionViewLayout: layout)

UICollectionView类负责管理数据的有序集合以及以自定义布局的模式来呈现这些数据,它提供了一些常用的表格(table)功能,此外还增加了许多单栏布局。UICollectionView支持可以用于实现多列网格、 平铺的布局、 圆形的布局和更多的自定义布局,甚至你可以动态地改变它的布局。

当将一个集合视图添加到您的用户界面,您的应用程序的主要工作是管理与该集合视图关联的数据。集合视图的数据源对象,是一个对象,符合 UICollectionViewDataSource 协议,提供由您的应用程序数据集合中视图分成单个的item,然后可以分为节为演示文稿中获取其数据。item是您想要呈现的数据的最小单位。例如,在照片的应用程序,item可能是一个单一的图像。集合视图使用一个cell来呈现item,这是您的数据源配置,并提供 UICollectionViewCell 类的一个实例。

除了将它嵌入在您的用户界面,您可以使用 UICollectionView 对象的方法以确保item的可视化表示匹配您的数据源对象中的顺序。因此,每当您添加、 删除或重新排列您的集合中的数据,您可以使用此类的方法来插入、 删除和重新排列相应cell的状态。您还使用集合视图对象来管理所选的item。

注册一个重用的cell

在这里我们要注意和tableView的区别,实例化一个UICollectionView时,为了能够使用cell,必须得使用下面的方法进行Cell类的注册,而对于tableView来说并不需要在实例化时使用方法对Cell类进行注册。对于这个注册函数需要注意一点:registerClass:的参数一定要是我们所使用的那个UICollectionViewCell类,否则就会报错!

  self.collectionView?.registerClass(UICollectionViewCell.self, forCellWithReuseIdentifier: "Cell")

与tableView一样,使用的时候同样要遵循协议UICollectionViewDelegate,UICollectionViewDataSource,使用代理,用法类似:

  self.collectionView?.delegate = self
  self.collectionView?.dataSource = self
实现代理方法
//collectionView行数
func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    return courses.count;
}
func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
    let identify:String = "Cell"
    //获取设计的单元格,不需要再动态添加界面元素
    let cell = (self.collectionView?.dequeueReusableCellWithReuseIdentifier(identify, forIndexPath: indexPath))! as UICollectionViewCell
    return cell;
}
func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
    
}
//点击item时调用
func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
    
}
//当前的item是否可以点击
func collectionView(collectionView: UICollectionView, shouldSelectItemAtIndexPath indexPath: NSIndexPath) -> Bool {
     return true;
}
 /* 自定义布局不需要调用
 //单元格大小
 func collectionView(collectionView: UICollectionView!,layout collectionViewLayout: UICollectionViewLayout!,sizeForItemAtIndexPath indexPath: NSIndexPath!) -> CGSize {
    let size:Float = indexPath.item % 3 == 0 ? 200 : 100
    return CGSize(width:size, height:size)
 }
 func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAtIndex section: Int) -> UIEdgeInsets {
    return UIEdgeInsetsMake(20, 20, 0, 20);
}
*/

在自定义UICollectionViewCell时,在

  func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell 

方法里我们仅需写入:

   let identify:String = "Cell"
   //获取设计的单元格,不需要再动态添加界面元素
   let cell = self.collectionView?.dequeueReusableCellWithReuseIdentifier(identify, forIndexPath: indexPath) as! UICollectionViewCell

而不需要像UITableViewCell那样判断Cell是否已被创建,这是因为在自定义UICollectionViewCell时有一个极其重要的方法:

 override func init(frame: CGRect) {
 }

这个方法是在初始化自定义的cell时系统自动调用的,所以不需要判断cell是否已经被创建。而对于UITableViewCell来说初始化方法并不唯一,所以我们需要在指定它的初始化方法。
此外还需注意的一点是,自定义的UICollectionViewCell没有UITableViewCell如下类似的方法:

 let cell = tableView.dequeueReusableCellWithIdentifier(identify,forIndexPath: indexPath) as UITableViewCell

而是有多一个indexPath参数的方法:

 let cell = self.collectionView?.dequeueReusableCellWithReuseIdentifier(identify, forIndexPath: indexPath) as! UICollectionViewCell

我们用OC代码自定义cell的时候我们都会把在cell里添加的那些信息变量是需要写在.h文件中作为公共的变量,但是在swift中我们无需担心这些,只要有自定义的cell对象我们就可以调用那些变量啦。

在以后的swift进阶中大脸猫会用到自定义的cell,到时候再详细说明咯。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,271评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,275评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,151评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,550评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,553评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,559评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,924评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,580评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,826评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,578评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,661评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,363评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,940评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,926评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,156评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,872评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,391评论 2 342

推荐阅读更多精彩内容

  • 翻译自“Collection View Programming Guide for iOS” 0 关于iOS集合视...
    lakerszhy阅读 3,811评论 1 22
  • 前言关于 iOS 10 UICollectionView的新特性,主要还是体现在如下3个方面 顺滑的滑动体验现在...
    ZhangCc_阅读 7,119评论 8 46
  • 大学时有段时间因为要做家教而晚归。一个人搭乘末班公交,懒散地靠在椅背上,耳机里循环着蔡健雅的《红色高跟鞋》。那是当...
    西沅Lfy阅读 1,149评论 0 0
  • 大学时期,周末对我而言似乎没有一点吸引力。因为睡懒觉并非周末的特权。工作后,由于工作性质原因,实行轮班制,当然,必...
    薛老师阅读 305评论 0 0
  • 原文地址:http://woodding2008.iteye.com/blog/2326677简介storm1.0...
    wangliang938阅读 789评论 0 2