效果

前言

这段时间比较忙,没太多的时间写博客,前段时间写了一些关于表格视图单选的文章,想着,一并把多选也做了,今天刚好有时间,去做这样一件事情。多选在我们的应用程序中也是常见的,比如消息的删除,群发联系人的选择,音乐的添加等等可能都会涉及到多选的需求,本文,我将模拟多选删除消息来讲讲多选的实现。

原理

多选删除其实很简单,并不复杂,我的思路就是创建一个数组,当用户选中某个单元格的时候,取到单元格上对应的数据,把它存入数组中,如果用户取消选中,直接将数据从数组中移除。当用户点击删除时,直接遍历数组,将表格视图数据源数组里面的与存选择数据的数组中的数据相对应一一删除,再刷新表格视图即可。

实现

界面搭建很简单,创建一个表格视图,添加导航栏,并在上面添加一个删除按钮,这里我就不细说了。

ViewController 中,我们先声明几个属性,其中 selectedDatas 主要用于记录用户选择的数据。

var tableView: UITableView?

var dataSource: [String]?

var selectedDatas: [String]?

创建初始化方法,初始化属性,别忘了还需要在 ViewDidLoad() 中调用方法初始化方法。

// MARK:Initialize methods
func initializeDatasource() {

    self.selectedDatas = []

    self.dataSource = []

    for index in 1...10 {
        index < 10 ? self.dataSource?.append("消息0\(index)") : self.dataSource?.append("消息\(index)")
    }
}

func initializeUserInterface() {

    self.title = "消息"
    self.automaticallyAdjustsScrollViewInsets = false

    // Add delete navigation item
    self.navigationItem.leftBarButtonItem = UIBarButtonItem(title: "删除",style: UIBarButtonItemStyle.Plain,target: self,action: Selector("respondsToBarButtonItem:"))

    // table view
    self.tableView = {
        let tableView = UITableView(frame: CGRectMake(0,64,CGRectGetWidth(self.view.bounds),CGRectGetHeight(self.view.bounds)),style: UITableViewStyle.Plain)
        tableView.dataSource = self
        tableView.delegate = self
        tableView.tableFooterView = UIView()
        return tableView
        }()
    self.view.addSubview(self.tableView!)   
}

此时,系统会报警告,提示你没有遵守协议,因为我们在初始化表格视图的时候为其设置了代理和数据源,遵守协议,并实现协议方法,配置数据源。

func numberOfSectionsInTableView(tableView: UITableView) -> Int {
    return 1
}

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

    return self.dataSource!.count
}

func tableView(tableView: UITableView,cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {

    var cell: CustomTableViewCell? = tableView.dequeueReusableCellWithIdentifier("cellReuseIdentifier") as? CustomTableViewCell
    if cell == nil {
        cell = CustomTableViewCell(style: UITableViewCellStyle.Value1,reuseIdentifier: "cellReuseIdentifier")
    }

    cell!.selectionStyle = UITableViewCellSelectionStyle.None
    cell!.textLabel?.text = self.dataSource![indexPath.row]
    cell!.detailTextLabel?.text = "昨天 10-11"

    return cell!
}

这里需要强调的是,表格视图的单元格是自定义的,在自定义单元格(CustomTableViewCell)中我只做了一个操作,就是根据单元格选中状态来切换图片的显示。

override func setSelected(selected: Bool,animated: Bool) {
    super.setSelected(selected,animated: animated)

    if selected {
        self.imageView?.image = UIImage(named: "iconfont-selected")
    }else {
        self.imageView?.image = UIImage(named: "iconfont-select")
    }
}

现在运行程序,界面已经显示出来了,下面我们将开始处理多选删除的逻辑,当我们点击单元格的时候发现,只能单选啊?我要怎么去多选呢?此时我们需要在配置表格视图的地方设置 allowsMultipleSelection 属性,将其值设为 YES

tableView.allowsMultipleSelection = true

接下来,实现代理方法 didSelectRowAtIndexPath:diddeselectRowAtIndexPath: ,这里我们将修改单元格选中与未选中状态下的颜色,只需根据参数 indexPath 获取到单元格,修改 backgroundColor 属性,并且,我们还需要获取单元格上的数据,去操作 selectedDatas 数组,具体实现如下。

func tableView(tableView: UITableView,didSelectRowAtIndexPath indexPath: NSIndexPath) {

    let cell = tableView.cellForRowAtIndexPath(indexPath)
    cell?.backgroundColor = UIColor.cyanColor()

    self.selectedDatas?.append((cell!.textLabel?.text)!)

}

func tableView(tableView: UITableView,diddeselectRowAtIndexPath indexPath: NSIndexPath) {

    let cell = tableView.cellForRowAtIndexPath(indexPath)
    cell?.backgroundColor = UIColor.whiteColor()

    let index = self.selectedDatas?.indexOf((cell?.textLabel?.text)!)
    self.selectedDatas?.removeAtIndex(index!)
}

diddeselectRowAtIndexPath: 方法中,我是根据表格视图单元格上的数据获取下标,再从数组中删除元素的,可能有的人会问,不能像OC一样调用 removeObject: 方法根据数据直接删除元素吗?并不能,因为Swift 提供的删除数组元素的方法中,大都是根据下标来删除数组元素的。

接下来,我们需要执行删除逻辑了,在删除按钮触发的方法中,我们要做的第一件事情就是异常处理,如果 selectedDatas 数组为空或者该数组并未初始化,我们无需再做删除处理,弹框提示即可。

// Exception handling

if (self.selectedDatas == nil) || (self.selectedDatas?.isEmpty == true) {

    let alertController = UIAlertController(title: "温馨提示",message: "请选择您要删除的数据!",preferredStyle: UIAlertControllerStyle.Alert)

    alertController.addAction(UIAlertAction(title: "确定",style: UIAlertActionStyle.Default,handler: nil))

    self.presentViewController(alertController,animated: true,completion: nil)

    return
}

异常处理之后,我们需要遍历 selectedDatas 数组,然后根据该数组中的数据获取到该数据在数据源(dataSource)里的下标,最后再根据该下标将数据从数据源中删除。

for data in self.selectedDatas! {

    // Get index with data
    let index = self.dataSource!.indexOf(data)

    // Delete data with index
    self.dataSource?.removeAtIndex(index!)
}

现在我们只需要刷新表格视图即可,当然, selectedDatas 数组我们也需要清空,以备下一次用户多选删除使用。

self.tableView?.reloadData()

self.selectedDatas?.removeAll()

为了提高用户体验,我们可以弹框提示用户删除成功,直接在后面加上以下代码。

let alertController = UIAlertController(title: "温馨提示",message: "数据删除成功!",preferredStyle: UIAlertControllerStyle.Alert)

self.presentViewController(alertController,animated: true,completion: nil)


dispatch_after(dispatch_time(disPATCH_TIME_Now,Int64(1.0 * Double(NSEC_PER_SEC))),dispatch_get_main_queue()) { () -> Void in
    self.presentedViewController?.dismissViewControllerAnimated(true,completion: nil)
}

代码中,我并未给弹出框添加 action ,而是通过一个延迟调用,来让弹出框自动消失,这样就避免了用户再次点击弹出框按钮来隐藏,提升用户体验。

OK,到了这一步,基本已经实现了,但是有一个小瑕疵,那就是当我删除了单元格的时候,界面上某些单元格会呈现选中状态的背景颜色,解决办法非常简单,我们只需要在配置单元格的协议方法中加上这一句话即可。

cell?.backgroundColor = UIColor.whiteColor()

Swift:表格视图单元格多选的更多相关文章

  1. HTML5实现直播间评论滚动效果的代码

    这篇文章主要介绍了HTML5实现直播间评论滚动效果的代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  2. html5教你做炫酷的碎片式图片切换 (canvas)

    本篇文章主要介绍了html5教你做炫酷的碎片式图片切换 (canvas) ,具有一定参考价值,有兴趣的可以了解一下

  3. html5使用canvas实现弹幕功能示例

    这篇文章主要介绍了html5使用canvas实现弹幕功能示例的相关资料,需要的朋友可以参考下

  4. 前端监听websocket消息并实时弹出(实例代码)

    这篇文章主要介绍了前端监听websocket消息并实时弹出,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  5. HTML5之消息通知的使用(Web Notification)

    通知可以说是web中比较常见且重要的功能,私信、在线提问、或者一些在线即时通讯工具我们总是希望第一时间知道对方有了新的反馈。本篇文章主要介绍了HTML5之消息通知的使用(Web Notification),感兴趣的小伙伴们可以参考一下

  6. HTML5中的Web Notification桌面通知功能的实现方法

    这篇文章主要介绍了HTML5中的Web Notification桌面通知功能的实现方法,需要的朋友可以参考下

  7. HTML5仿微信聊天界面、微信朋友圈实例代码

    小编最近开发一个基于html5开发的一个微信聊天前端界面,功能很全面,下面小编给大家分享实例代码,需要的朋友参考下

  8. HTML5的postMessage的使用手册

    HTML5提出了一个新的用来跨域传值的方法,即postMessage,这篇文章主要介绍了HTML5的postMessage的使用手册的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  9. 前端实现弹幕效果的方法总结(包含css3和canvas的实现方式)

    这篇文章主要介绍了前端实现弹幕效果的方法总结(包含css3和canvas的实现方式)的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  10. H5 canvas实现贪吃蛇小游戏

    本篇文章主要介绍了H5 canvas实现贪吃蛇小游戏,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

随机推荐

  1. Swift UITextField,UITextView,UISegmentedControl,UISwitch

    下面我们通过一个demo来简单的实现下这些控件的功能.首先,我们拖将这几个控件拖到storyboard,并关联上相应的属性和动作.如图:关联上属性和动作后,看看实现的代码:

  2. swift UISlider,UIStepper

    我们用两个label来显示slider和stepper的值.再用张图片来显示改变stepper值的效果.首先,这三个控件需要全局变量声明如下然后,我们对所有的控件做个简单的布局:最后,当slider的值改变时,我们用一个label来显示值的变化,同样,用另一个label来显示stepper值的变化,并改变图片的大小:实现效果如下:

  3. preferredFontForTextStyle字体设置之更改

    即:

  4. Swift没有异常处理,遇到功能性错误怎么办?

    本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请发送邮件至dio@foxmail.com举报,一经查实,本站将立刻删除。

  5. 字典实战和UIKit初探

    ios中数组和字典的应用Applicationschedule类别子项类别名称优先级数据包contactsentertainment接触UIKit学习用Swift调用CocoaTouchimportUIKitletcolors=[]varbackView=UIView(frame:CGRectMake(0.0,0.0,320.0,CGFloat(colors.count*50)))backView

  6. swift语言IOS8开发战记21 Core Data2

    上一话中我们简单地介绍了一些coredata的基本知识,这一话我们通过编程来实现coredata的使用。还记得我们在coredata中定义的那个Model么,上面这段代码会加载这个Model。定义完方法之后,我们对coredata的准备都已经完成了。最后强调一点,coredata并不是数据库,它只是一个框架,协助我们进行数据库操作,它并不关心我们把数据存到哪里。

  7. swift语言IOS8开发战记22 Core Data3

    上一话我们定义了与coredata有关的变量和方法,做足了准备工作,这一话我们来试试能不能成功。首先打开上一话中生成的Info类,在其中引用头文件的地方添加一个@objc,不然后面会报错,我也不知道为什么。

  8. swift实战小程序1天气预报

    在有一定swift基础的情况下,让我们来做一些小程序练练手,今天来试试做一个简单地天气预报。然后在btnpressed方法中依旧增加loadWeather方法.在loadWeather方法中加上信息的显示语句:运行一下看看效果,如图:虽然显示出来了,但是我们的text是可编辑状态的,在storyboard中勾选Editable,再次运行:大功告成,而且现在每次单击按钮,就会重新请求天气情况,大家也来试试吧。

  9. 【iOS学习01】swift ? and !  的学习

    如果不初始化就会报错。

  10. swift语言IOS8开发战记23 Core Data4

    接着我们需要把我们的Rest类变成一个被coredata管理的类,点开Rest类,作如下修改:关键字@NSManaged的作用是与实体中对应的属性通信,BinaryData对应的类型是NSData,CoreData没有布尔属性,只能用0和1来区分。进行如下操作,输入类名:建立好之后因为我们之前写的代码有些地方并不适用于coredata,所以编译器会报错,现在来一一解决。

返回
顶部