Swift - 可编辑表格样例(可直接编辑单元格中内容、移动删除单元格)
生活随笔
收集整理的這篇文章主要介紹了
Swift - 可编辑表格样例(可直接编辑单元格中内容、移动删除单元格)
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
(本文代碼已升級至Swift3) 本文演示如何制作一個可以編輯單元格內容的表格(UITableView)。
1,效果圖 (1)默認狀態下,表格不可編輯,當點擊單元格的時候會彈出提示框顯示選中的內容。 ? ? ? ? ?
(2)點擊導航欄右側編輯按鈕,表格進入可以編輯狀態
(3)這時我們可以刪除表格項。
(4)也可以拖動調整單元格的順序。
(5)然后就是本文的重點,在編輯狀態下。直接點擊單元格,即可在當前頁面下直接編輯修改單元格中的內容。
2,單元格編輯功能講解 (1)通過自定義 UITableViewCell,在其內部添加一個 textField 來實現可編輯的cell。 (2)通過改變 userInteractionEnabled 屬性,可以讓 textField 在可編輯與只讀兩個狀態間切換。 (3)在編輯狀態下要加大 textField 的左邊距,因為左側會出現個刪除按鈕圖標。 (4)同時在編輯 cell 內容的時候,由于鍵盤會彈出擋到后面的表格。所以我們在鍵盤出現的時候,要通過改變 edgeInsets 的辦法在底部加大 tableview 的 contentview 大小。 而結束編輯隱藏鍵盤時,需要還原 tableview 的 contentview 的尺寸。
3,程序代碼 --- MyTableViewCell.swift(自定義單元格類)---
--- ViewController.swift(主類)---
源碼下載:hangge_1175.zip
原文出自:www.hangge.com??轉載請保留原文鏈接:http://www.hangge.com/blog/cache/detail_1175.html
1,效果圖 (1)默認狀態下,表格不可編輯,當點擊單元格的時候會彈出提示框顯示選中的內容。 ? ? ? ? ?
(2)點擊導航欄右側編輯按鈕,表格進入可以編輯狀態
(3)這時我們可以刪除表格項。
(4)也可以拖動調整單元格的順序。
(5)然后就是本文的重點,在編輯狀態下。直接點擊單元格,即可在當前頁面下直接編輯修改單元格中的內容。
2,單元格編輯功能講解 (1)通過自定義 UITableViewCell,在其內部添加一個 textField 來實現可編輯的cell。 (2)通過改變 userInteractionEnabled 屬性,可以讓 textField 在可編輯與只讀兩個狀態間切換。 (3)在編輯狀態下要加大 textField 的左邊距,因為左側會出現個刪除按鈕圖標。 (4)同時在編輯 cell 內容的時候,由于鍵盤會彈出擋到后面的表格。所以我們在鍵盤出現的時候,要通過改變 edgeInsets 的辦法在底部加大 tableview 的 contentview 大小。 而結束編輯隱藏鍵盤時,需要還原 tableview 的 contentview 的尺寸。
3,程序代碼 --- MyTableViewCell.swift(自定義單元格類)---
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 | import UIKit //表格數據實體類 class ListItem: NSObject { ????var text: String ????? ????init(text: String) { ????????self.text = text ????} } //單元格類 class MyTableViewCell: UITableViewCell, UITextFieldDelegate { ????//單元格內部標簽(可輸入) ????let label:UITextField ????//單元格左邊距 ????var leftMarginForLabel: CGFloat = 15.0 ????? ????//單元格數據 ????var listItem:ListItem? { ????????didSet { ????????????label.text = listItem!.text ????????} ????} ????? ????//單元格是否可編輯 ????var labelEditable:Bool? { ????????didSet { ????????????label.isUserInteractionEnabled = labelEditable! ????????????//如果是可以編輯的話,要加大左邊距(因為左邊有個刪除按鈕) ????????????leftMarginForLabel = labelEditable! ? 45.0 : 15.0 ????????????self.setNeedsLayout() ????????} ????} ????? ????//初始化 ????override init(style: UITableViewCellStyle, reuseIdentifier: String?) { ????????//初始化文本標簽 ????????label = UITextField(frame: CGRect.null) ????????label.textColor = UIColor.black ????????label.font = UIFont.systemFont(ofSize: 16) ????????? ????????super.init(style: style, reuseIdentifier: reuseIdentifier) ????????? ????????//設置文本標簽代理 ????????label.delegate = self ????????label.contentVerticalAlignment = UIControlContentVerticalAlignment.center ????????//添加文本標簽 ????????addSubview(label) ????} ????? ????//布局 ????override func layoutSubviews() { ????????super.layoutSubviews() ????????label.frame = CGRect(x: leftMarginForLabel, y: 0, ?????????????????????????????width: bounds.size.width - leftMarginForLabel, ?????????????????????????????height: bounds.size.height) ????} ????? ????//鍵盤回車 ????func textFieldShouldReturn(_ textField: UITextField) -> Bool { ????????textField.resignFirstResponder() ????????return false ????} ????? ????//結束編輯 ????func textFieldShouldEndEditing(_ textField: UITextField) -> Bool { ????????if listItem != nil { ????????????listItem?.text = textField.text! ????????} ????????return true ????} ????? ????required init?(coder aDecoder: NSCoder) { ????????fatalError("init(coder:) has not been implemented") ????} } |
--- ViewController.swift(主類)---
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 | import UIKit class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource{ ????? ????//表格 ????var tableView:UITableView? ????//表格數據 ????var listItems = [ListItem]() ????? ????override func viewDidLoad() { ????????super.viewDidLoad() ????????? ????????//初始化數據 ????????listItems = [ListItem(text: "這是條目1"), ListItem(text: "這是條目2"), ?????????????????????ListItem(text: "這是條目3"), ListItem(text: "這是條目4"), ?????????????????????ListItem(text: "這是條目5"), ListItem(text: "這是條目6"), ?????????????????????ListItem(text: "這是條目7"), ListItem(text: "這是條目8"), ?????????????????????ListItem(text: "這是條目9"), ListItem(text: "這是條目10"), ?????????????????????ListItem(text: "這是條目11"), ListItem(text: "這是條目12"), ?????????????????????ListItem(text: "這是條目13"), ListItem(text: "這是條目14"), ?????????????????????ListItem(text: "這是條目15"), ListItem(text: "這是條目16"), ?????????????????????ListItem(text: "這是條目17")] ????????? ????????//創建表視圖 ????????self.tableView = UITableView(frame:self.view.frame, style:.plain) ????????self.tableView!.delegate = self ????????self.tableView!.dataSource = self ????????//創建一個重用的單元格 ????????self.tableView!.register(MyTableViewCell.self, forCellReuseIdentifier: "tableCell") ????????self.view.addSubview(self.tableView!) ????????? ????????//監聽鍵盤彈出通知 ????????NotificationCenter.default ????????????.addObserver(self,selector: #selector(keyboardWillShow(_:)), ?????????????????????????name: NSNotification.Name.UIKeyboardWillShow, object: nil) ????????//監聽鍵盤隱藏通知 ????????NotificationCenter.default ????????????.addObserver(self,selector: #selector(keyboardWillHide(_:)), ?????????????????????????name: NSNotification.Name.UIKeyboardWillHide, object: nil) ????} ????? ????//導航欄編輯按鈕點擊 ????@IBAction func editBarBtnClick(_ sender: UIBarButtonItem) { ????????//在正常狀態和編輯狀態之間切換 ????????if(self.tableView!.isEditing == false){ ????????????self.tableView!.setEditing(true, animated:true) ????????????sender.title = "保存" ????????} ????????else{ ????????????self.tableView!.setEditing(false, animated:true) ????????????sender.title = "編輯" ????????} ????????//重新加載表數據(改變單元格輸入框編輯/只讀狀態) ????????self.tableView?.reloadData() ????} ????? ????//在本例中,有1個分區 ????func numberOfSections(in tableView: UITableView) -> Int { ????????return 1 ????} ????? ????//返回表格行數 ????func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { ????????return listItems.count ????} ????? ????//創建各單元顯示內容(創建參數indexPath指定的單元) ????func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) ????????-> UITableViewCell ????{ ????????let cell = tableView ????????????.dequeueReusableCell(withIdentifier: "tableCell", for: indexPath) ????????????as! MyTableViewCell ????????//設置單元格內容 ????????let item = listItems[(indexPath as NSIndexPath).row] ????????cell.listItem = item ????????cell.accessoryType = UITableViewCellAccessoryType.disclosureIndicator ????????//內容標簽是否可編輯 ????????cell.labelEditable = tableView.isEditing ????????return cell ????} ????? ????// UITableViewDelegate 方法,處理列表項的選中事件 ????func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) ????{ ????????self.tableView!.deselectRow(at: indexPath, animated: true) ????????let itemString = listItems[(indexPath as NSIndexPath).row].text ????????let alertController = UIAlertController(title: "提示!", ????????????????????????????????????????????????message: "你選中了【\(itemString)】", ????????????preferredStyle: .alert) ????????let okAction = UIAlertAction(title: "確定", style: .cancel, handler: nil) ????????alertController.addAction(okAction) ????????self.present(alertController, animated: true, completion: nil) ????} ????? ????//是否有刪除功能 ????func tableView(_ tableView: UITableView, editingStyleForRowAt indexPath: IndexPath) ????????-> UITableViewCellEditingStyle ????{ ????????if(self.tableView!.isEditing == false){ ????????????return UITableViewCellEditingStyle.none ????????}else{ ????????????return UITableViewCellEditingStyle.delete ????????} ????} ????? ????//刪除提示 ????func tableView(_ tableView: UITableView, ???????????????????titleForDeleteConfirmationButtonForRowAt indexPath: IndexPath) ????????-> String? { ????????????return "確定刪除?" ????} ????? ????//編輯完畢(這里只有刪除操作) ????func tableView(_ tableView: UITableView, ???????????????????commit editingStyle: UITableViewCellEditingStyle, ???????????????????forRowAt indexPath: IndexPath) { ????????if(editingStyle == UITableViewCellEditingStyle.delete) ????????{ ????????????self.listItems.remove(at: (indexPath as NSIndexPath).row) ????????????self.tableView!.reloadData() ????????????print("你確認了刪除按鈕") ????????} ????} ????? ????//在編輯狀態,可以拖動設置cell位置 ????func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool { ????????return true ????} ????? ????//移動cell事件 ????func tableView(_ tableView: UITableView, moveRowAt fromIndexPath: IndexPath, ???????????????????to toIndexPath: IndexPath) { ????????if fromIndexPath != toIndexPath{ ????????????//獲取移動行對應的值 ????????????let itemValue:ListItem = listItems[(fromIndexPath as NSIndexPath).row] ????????????//刪除移動的值 ????????????listItems.remove(at: (fromIndexPath as NSIndexPath).row) ????????????//如果移動區域大于現有行數,直接在最后添加移動的值 ????????????if (toIndexPath as NSIndexPath).row > listItems.count{ ????????????????listItems.append(itemValue) ????????????}else{ ????????????????//沒有超過最大行數,則在目標位置添加剛才刪除的值 ????????????????listItems.insert(itemValue, at:(toIndexPath as NSIndexPath).row) ????????????} ????????} ????} ????? ????// 鍵盤顯示 ????func keyboardWillShow(_ notification: Notification) { ????????let userInfo = (notification as NSNotification).userInfo! ????????//鍵盤尺寸 ????????let keyboardSize = (userInfo[UIKeyboardFrameBeginUserInfoKey] ????????????as! NSValue).cgRectValue ????????var contentInsets:UIEdgeInsets ????????//判斷是橫屏還是豎屏 ????????let statusBarOrientation = UIApplication.shared.statusBarOrientation ????????if UIInterfaceOrientationIsPortrait(statusBarOrientation) { ????????????contentInsets = UIEdgeInsetsMake(64.0, 0.0, (keyboardSize.height), 0.0); ????????} else { ????????????contentInsets = UIEdgeInsetsMake(64.0, 0.0, (keyboardSize.width), 0.0); ????????} ????????//tableview的contentview的底部大小 ????????self.tableView!.contentInset = contentInsets; ????????self.tableView!.scrollIndicatorInsets = contentInsets; ????} ????? ????// 鍵盤隱藏 ????func keyboardWillHide(_ notification: Notification) { ????????//還原tableview的contentview大小 ????????let contentInsets:UIEdgeInsets = UIEdgeInsetsMake(64.0, 0.0, 0, 0.0); ????????self.tableView!.contentInset = contentInsets ????????self.tableView!.scrollIndicatorInsets = contentInsets ????} ????? ????//頁面移除時 ????override func viewDidDisappear(_ animated: Bool) { ????????super.viewDidAppear(animated) ????????//取消鍵盤監聽通知 ????????NotificationCenter.default.removeObserver(self) ????} ????? ????override func didReceiveMemoryWarning() { ????????super.didReceiveMemoryWarning() ????} } |
原文出自:www.hangge.com??轉載請保留原文鏈接:http://www.hangge.com/blog/cache/detail_1175.html
轉載于:https://www.cnblogs.com/Free-Thinker/p/7264300.html
總結
以上是生活随笔為你收集整理的Swift - 可编辑表格样例(可直接编辑单元格中内容、移动删除单元格)的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Linux中查看端口占用情况及结束相应进
- 下一篇: web程序部署常见(404)错误