1嗓节、tableView 的編輯模式

進(jìn)入編輯模式

代碼體現(xiàn)

// 設(shè)置 editing 屬性tableView?.editing =true// 這個(gè)設(shè)置的時(shí)候是有動(dòng)畫效果的tableView.setEditing(true, animated:true)// 我一般喜歡的設(shè)置方式 （寫在 btn 或者 item 的監(jiān)聽方法里面）// 實(shí)現(xiàn)編輯模式和非編輯模式的切換tableView.editing? = !tableView.editing tableView.setEditing(!tableView.editing, animated:true)

@IBActionfunceditItemAction(sender: AnyObject){? ? ? ? tableView.editing? = !tableView.editing//? ? ? ? tableView.setEditing(!tableView.editing, animated: true)}

效果圖

沒有動(dòng)畫效果

tableView.editing? = !tableView.editing

有動(dòng)畫效果

tableView.setEditing(!tableView.editing, animated: true)

2荧缘、 設(shè)置某一行能夠進(jìn)行編輯

cell 的默認(rèn)編輯模式是 delete

// Individual rows can opt out of having the -editing property set for them. If not implemented, all rows are assumed to be editable.// 單行能夠可選的設(shè)置編輯1.? 設(shè)置 tableView 的 editing 屬性2.? 實(shí)現(xiàn)這個(gè)方法// tableView 的某一行能夠進(jìn)行編輯模式// 這個(gè)方法不實(shí)現(xiàn)，默認(rèn)是每一行都進(jìn)入編輯模式optionalpublicfunctableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath)->Bool

@IBActionfunceditItemAction(sender: AnyObject){? ? ? ? tableView.setEditing(!tableView.editing, animated:true)}// 這是一個(gè)數(shù)據(jù)源方法// 設(shè)置 tableView 那一行進(jìn)入編輯模式functableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath)->Bool{// 雙數(shù) row 行進(jìn)入編輯模式ifindexPath.row %2==0{returnfalse}returntrue}

3.gif

3拦宣、 設(shè)置某一行編輯模式的樣式

cell 編輯模式枚舉

publicenumUITableViewCellEditingStyle:Int{caseNone// 正常模式 （這一個(gè)主要用于 cell 的移動(dòng)）caseDelete// 刪除模式caseInsert// 插入模式}

cell 編輯模式設(shè)置

// Allows customization of the editingStyle for a particular cell located at 'indexPath'. If not implemented, all editable cells will have UITableViewCellEditingStyleDelete set for them when the table has editing property set to YES.// 允許用戶通過實(shí)行這個(gè)方法來自定義 cell 的編輯樣式截粗， 如果沒有實(shí)現(xiàn)這個(gè)方法， 所有的 cell 的默認(rèn)編輯樣式為 UITableViewCellEditingStyleDelete . 只有 editing 屬性設(shè)置為 true 的時(shí)候才可以看到效果optionalpublicfunctableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath)->UITableViewCellEditingStyle

代碼

/*!

設(shè)置某一行的編輯樣式

*/

func tableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCellEditingStyle {

let number = indexPath.row % 3

switch number {

case 0:

print("0")

return UITableViewCellEditingStyle.Delete

case 1:

print("1")

return UITableViewCellEditingStyle.Insert

default:

print("2")

return UITableViewCellEditingStyle.None

}

}

效果：

4.gif

上部分只是編輯樣式的展示

4鸵隧、 編輯模式的事件回調(diào)

@available(iOS2.0, *)// 編輯樣式 add 和 delete 附加視圖點(diǎn)擊的回調(diào)optionalpublicfunctableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath)

默認(rèn)實(shí)現(xiàn)編輯事件回調(diào)方法：

functableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath){// 沒有添加任何的功能代碼}

實(shí)現(xiàn)這個(gè)方法后绸罗，在非編輯模式下，左滑動(dòng) cell 會(huì)顯示一個(gè) delete 按鈕掰派。

效果：

9.gif

先進(jìn)入了編輯模式从诲，查看了每個(gè) cell 的編輯模式的樣式。（cell 的編輯模式的設(shè)置看上面的代碼）

在非編輯模式下靡羡，只有 cell 的編輯模式是 delete 的系洛，才可以進(jìn)行左側(cè)滑。

關(guān)于 cell 側(cè)滑功能的實(shí)現(xiàn)可以先查看這段代碼, 后續(xù)后詳細(xì)說明略步！

事件的回調(diào)處理

實(shí)例代碼

functableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath){switcheditingStyle {case.Delete:print("Delete")// 移除模型數(shù)據(jù)（不移除就會(huì)報(bào)錯(cuò)）localData.removeAtIndex(indexPath.row)// 刪除某一行 celltableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Automatic)case.Insert:print("Insert")letstr ="new"+ localData[indexPath.row]// 添加模型數(shù)據(jù) （不插入就會(huì)報(bào)錯(cuò)）localData.insert(str, atIndex: indexPath.row)// 這一步只會(huì)刷新插入的哪一行tableView.insertRowsAtIndexPaths([indexPath], withRowAnimation: .Automatic)case.None:print("None")// None 樣式 是給 cell 的移動(dòng)準(zhǔn)備的描扯，這里永遠(yuǎn)也不會(huì)打印（移動(dòng)的時(shí)候并不需要插入和刪除）}}

/*!

設(shè)置某一行的編輯樣式

*/functableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath)->UITableViewCellEditingStyle{print(#function)letnumber = indexPath.row %3switchnumber {case0:returnUITableViewCellEditingStyle.Deletecase1:returnUITableViewCellEditingStyle.Insertdefault:// None 樣式 是給 cell 的移動(dòng)準(zhǔn)備的returnUITableViewCellEditingStyle.None}? ? }

回調(diào)效果：

1.gif

進(jìn)入到編輯模式后趟薄，會(huì)默認(rèn)的調(diào)用func tableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCellEditingStyle绽诚， 刷新每一行的 cell 編輯樣式。

點(diǎn)擊左邊的刪除按鈕杭煎，cell 會(huì)出現(xiàn)側(cè)滑恩够，顯示一個(gè) delete，只有點(diǎn)擊了 delete 之后才可以進(jìn)行刪除羡铲。 刪除一個(gè) cell 后蜂桶，會(huì)再一次調(diào)用func tableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCellEditingStyle方法，刷新每一個(gè) cell 編輯樣式 也切。（方法調(diào)用的個(gè)數(shù)變少了）

點(diǎn)擊添加按鈕扑媚，cell 不會(huì)出現(xiàn)側(cè)滑， 直接調(diào)用回調(diào)方法雷恃。會(huì)再一次調(diào)用func tableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCellEditingStyle方法疆股，刷新每一個(gè) cell 編輯樣式 。（cell 個(gè)數(shù)增加了）

當(dāng) cell 的編輯樣式是None的時(shí)候倒槐， 點(diǎn)擊是沒有任何效果的旬痹。

注意點(diǎn)：

由于進(jìn)行 delete 和 Insert 操作的回調(diào)func tableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCellEditingStyle方法。

所以， cell 編輯模式需要用一個(gè) 數(shù)組來記錄唱凯。來保證羡忘， delete 和 Insert? 操作之后，和之前 cell 的編輯樣式是對(duì)應(yīng)的磕昼。

// 定義一個(gè) 空的數(shù)組

var cellEditingStyle: [Int] = []

// 設(shè)置默認(rèn)值

for? index in 0 ..< localData.count {

cellEditingStyle.append(index)

}

functableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath){switcheditingStyle {case.Delete:print("Delete")? ? ? ? localData.removeAtIndex(indexPath.row)// 編輯模式數(shù)據(jù)刪除cellEditingStyle.removeAtIndex(indexPath.row)? ? ? ? tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Automatic)case.Insert:print("Insert")? ? ? ? localData.insert("new"+ localData[indexPath.row], atIndex: indexPath.row)// 編輯模式數(shù)據(jù)添加 （設(shè)置為 刪除）cellEditingStyle.insert(0, atIndex: indexPath.row)? ? ? ? tableView.insertRowsAtIndexPaths([indexPath], withRowAnimation: .Automatic)case.None:print("None")// None 樣式 是給 cell 的移動(dòng)準(zhǔn)備的，這里永遠(yuǎn)也不會(huì)打印}}functableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath)->UITableViewCellEditingStyle{print(#function)// 獲取對(duì)應(yīng)的數(shù)據(jù)進(jìn)行設(shè)置letnumber = cellEditingStyle[indexPath.row] %3switchnumber {case0:returnUITableViewCellEditingStyle.Deletecase1:returnUITableViewCellEditingStyle.Insertdefault:returnUITableViewCellEditingStyle.None}}

使用這種方式

3.gif

編輯模式的數(shù)據(jù)可以和 cell 對(duì)應(yīng)的模型數(shù)據(jù)綁定节猿。一種 MVC 的思想

5票从、 編輯模式中的選中操作

編輯模式中的選中操作用到的 API：

// 允許在編輯模式下進(jìn)行單選// 默認(rèn)為 NopublicvarallowsSelectionDuringEditing:Bool// default is NO. Controls whether rows can be selected when in editing mode// 允許在編輯模式進(jìn)行多選// 默認(rèn)為 NopublicvarallowsMultipleSelectionDuringEditing:Bool// default is NO. Controls whether multiple rows can be selected simultaneously in editing mode// 當(dāng)前選中的索引的獲取// 獲取當(dāng)前選中單行的索引publicvarindexPathForSelectedRow:NSIndexPath? {get}// returns nil or index path representing section and row of selection.// 獲取當(dāng)前選中多行的索引publicvarindexPathsForSelectedRows: [NSIndexPath]? {get}// returns nil or a set of index paths representing the sections and rows of the selection.

代碼演示：

// 進(jìn)入編輯模式tableView.editing? = !tableView.editing// 編輯模式下單選tableView.allowsSelectionDuringEditing =true// 編輯模式下多選tableView.allowsMultipleSelectionDuringEditing =true

我使用的是tableView.allowsMultipleSelectionDuringEditing = true來實(shí)現(xiàn)單選和多選操作。

tableView.allowsSelectionDuringEditing = true效果后面介紹滨嘱。

這種效果也是我們?cè)陧?xiàng)目中最常見的

關(guān)鍵代碼@IBActionfunceditItemAction(sender: AnyObject){// 非動(dòng)畫//? ? ? ? tableView.editing = !tableView.editing//? ? ? ? tableView.allowsSelectionDuringEditing = !tableView.editing// 在編輯模式下多選tableView.allowsMultipleSelectionDuringEditing = !tableView.editing// 動(dòng)畫 （ 建議使用這個(gè) ）tableView.setEditing(!tableView.editing, animated:true)}/*? 注釋掉這個(gè)代碼就可實(shí)現(xiàn)多選? */// cell 將要選中的回調(diào)代理// 在這個(gè)方法中主要進(jìn)行的是取消上一次選中functableView(tableView: UITableView, willSelectRowAtIndexPath indexPath: NSIndexPath)->NSIndexPath? {// 這個(gè)方法第一次調(diào)用的時(shí)候 indexPath 為 nilifletselectedRowIndexPath = tableView.indexPathForSelectedRow {// 去除上一次選中tableView.deselectRowAtIndexPath(selectedRowIndexPath, animated:true)? ? }returnindexPath}

選中效果演示：

單選

多選操作

當(dāng)前選中的索引的獲取

// 獲取當(dāng)前選中單行的索引

public var indexPathForSelectedRow: NSIndexPath? { get }

// 獲取當(dāng)前選中多行的索引

public var indexPathsForSelectedRows: [NSIndexPath]? { get }

最簡(jiǎn)單的獲取選中 cell 的方式就是下面的兩個(gè)接口峰鄙。使用這兩個(gè)接口，我們就不需要另外的再去定義變量記錄選中的 cell 太雨。

tableView.allowsSelectionDuringEditing = true 的特別說明：

這個(gè)tableView.allowsSelectionDuringEditing設(shè)置效果是有點(diǎn)讓人疑惑的吟榴。在看到多選的效果后，我一直以為 編輯模式下囊扳，單選 的效果 和 多選的效果類似吩翻，也應(yīng)該有個(gè)圈圈事實(shí)證明我是錯(cuò)的！

單選和多選的效果：

普通模式下的不能選擇锥咸，單選和多選：

// 這個(gè)屬性狭瞎，默認(rèn)是 true 的，設(shè)置為 false 后搏予，不能進(jìn)行 cell 的選中操作熊锭。// 同時(shí)也禁止了 代理方法選中的回調(diào)tableView.allowsSelection =false

點(diǎn)擊 cell 沒人任何效果！

tableView.allowsSelection = false

tableView.allowsSelection =true

tableView.allowsSelection = true

// 多選為 true 后雪侥，單選肯定也為 truetableView.allowsMultipleSelection =true

3.gif

編輯模式下的單選：

tableView.editing =true// 編輯模式下碗殷，cell 默認(rèn)是不能進(jìn)行選中操作的tableView.allowsSelectionDuringEditing =false

在編輯模式下，默認(rèn) cell 默認(rèn)是不能響應(yīng)點(diǎn)擊事件的速缨。并且锌妻，control view 還是會(huì)根據(jù) cell 編輯模式的進(jìn)行顯示（我們看到的加號(hào) ，減號(hào)鸟廓，空白）从祝。

tableView.allowsMultipleSelection = false

tableView.editing =truetableView.allowsSelectionDuringEditing =true

單選是沒有圈圈效果的，就是單純的 cell 高亮引谜。并且牍陌，control view 還是會(huì)根據(jù) cell 編輯模式的進(jìn)行顯示（我們看到的加號(hào) ，減號(hào)员咽，空白）毒涧。

tableView.allowsSelectionDuringEditing = true

tableView.editing =truetableView.allowsMultipleSelectionDuringEditing =true

多選模式下，會(huì)修改 control view 的顯示贝室，將 加號(hào)契讲，減號(hào)仿吞，空白替換為圈圈

4.gif

6、 編輯模式中 cell 的 Move （移動(dòng)操作）

默認(rèn)情況下tableView 中的 cell 是不能進(jìn)行移動(dòng)操作, 只有在編輯模式下捡偏，tableView? 的 cell 可以進(jìn)行移動(dòng)操作唤冈。

簡(jiǎn)單的顯示 cell 移動(dòng)的附加視圖

這只是簡(jiǎn)單的效果顯示

// Data manipulation - reorder / moving supportoptionalpublicfunctableView(tableView: UITableView, moveRowAtIndexPath sourceIndexPath: NSIndexPath, toIndexPath destinationIndexPath: NSIndexPath)// 進(jìn)入編輯模式tableView.editing? = !tableView.editing// cell 的移動(dòng)和排序操作 ( 方法的簡(jiǎn)單實(shí)現(xiàn))functableView(tableView: UITableView, moveRowAtIndexPath sourceIndexPath: NSIndexPath, toIndexPath destinationIndexPath: NSIndexPath){}// 消除不必要的影響/*!

設(shè)置某一行的編輯樣式

*/functableView(tableView: UITableView, editingStyleForRowAtIndexPath indexPath: NSIndexPath)->UITableViewCellEditingStyle{// 獲取 cell 對(duì)應(yīng)的編輯模式的緩存數(shù)據(jù)letnumber = cellEditingStyle[indexPath.row] %3switchnumber {// 注釋這里，主要是為了消除银伟，其他功能的影響你虹。//? ? ? ? case 0://? ? ? ? ? ? print("0")//? ? ? ? ? ? return UITableViewCellEditingStyle.Delete//? ? ? ? case 1://? ? ? ? ? ? print("1")//? ? ? ? ? ? return UITableViewCellEditingStyle.Insertdefault:print("2")// 這一個(gè)模式是用來排序移動(dòng)準(zhǔn)備用的returnUITableViewCellEditingStyle.None}}

效果：

4.gif

7、 編輯模式中指定某一行 cell 可以 Move

// 指定哪一個(gè) cell 能夠移動(dòng)functableView(tableView: UITableView, canMoveRowAtIndexPath indexPath: NSIndexPath)->Bool{// 單數(shù) row 行進(jìn)入可移動(dòng)模式ifindexPath.row %2==0{returnfalse}returntrue}

效果：

4.gif

3彤避、tableView 的移動(dòng)和排序

// Moving/reordering// Allows the reorder accessory view to optionally be shown for a particular row. By default, the reorder control will be shown only if the datasource implements -tableView:moveRowAtIndexPath:toIndexPath:// 允許某一行的排序的附加視圖顯示傅物，只用在數(shù)據(jù)源 實(shí)現(xiàn)了 -tableView:moveRowAtIndexPath:toIndexPath: 方法的時(shí)候 這個(gè)方法才有效@available(iOS2.0, *)optionalpublicfunctableView(tableView: UITableView, canMoveRowAtIndexPath indexPath: NSIndexPath)->Bool

傳說中支持移動(dòng)和排序的方法

// Data manipulation - reorder / moving support@available(iOS2.0, *)optionalpublicfunctableView(tableView: UITableView, moveRowAtIndexPath sourceIndexPath: NSIndexPath, toIndexPath destinationIndexPath: NSIndexPath)

代碼體現(xiàn)

// cell 的移動(dòng)和排序操作functableView(tableView: UITableView, moveRowAtIndexPath sourceIndexPath: NSIndexPath, toIndexPath destinationIndexPath: NSIndexPath){}// 指定哪一個(gè) cell 能夠移動(dòng)functableView(tableView: UITableView, canMoveRowAtIndexPath indexPath: NSIndexPath)->Bool{// 單數(shù) row 行進(jìn)入可移動(dòng)模式ifindexPath.row %2==0{returnfalse}returntrue}

效果圖

Snip20160602_31.png

4、tableView 索引設(shè)置

// Index@available(iOS2.0, *)// 通過實(shí)行這個(gè)方法琉预，返回一個(gè) string 的數(shù)組就可以設(shè)置索引optionalpublicfuncsectionIndexTitlesForTableView(tableView: UITableView)-> [String]?// return list of section titles to display in section index view (e.g. "ABCD...Z#")@available(iOS2.0, *)// 索引選中的回調(diào)optionalpublicfunctableView(tableView: UITableView, sectionForSectionIndexTitle title: String, atIndex index: Int)->Int// tell table which section corresponds to section title/index (e.g. "B",1))

單獨(dú)設(shè)置索引

// 索引設(shè)置funcsectionIndexTitlesForTableView(tableView: UITableView)-> [String]? {return["A","B","C","D","E","F","G"]}

效果圖

Snip20160602_32.png

當(dāng)只實(shí)行單獨(dú)設(shè)置索引的方法董饰，點(diǎn)擊索引會(huì)默認(rèn)的滾動(dòng)到索引對(duì)應(yīng)順序的組。

// 索引設(shè)置funcsectionIndexTitlesForTableView(tableView: UITableView)-> [String]? {return["A","B","C","D","E","F","G"]}// 告訴表部分對(duì)應(yīng)部分標(biāo)題/索引(當(dāng)點(diǎn)擊索引的時(shí)候回調(diào)用這個(gè)方法)/*

實(shí)現(xiàn)這個(gè)方法圆米，點(diǎn)擊索引的只會(huì)滾動(dòng)一次卒暂，滾動(dòng)后執(zhí)行的是索引的回調(diào)

*/functableView(tableView: UITableView, sectionForSectionIndexTitle title: String, atIndex index: Int)->Int{print(title , index)return3}

作者：Laughingg

鏈接：http://www.reibang.com/p/aaf2c88c58f0

來源：簡(jiǎn)書

著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)榨咐，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處介却。