Giới thiệu
Swipe actions trong UITableViewCell là một trong những tính năng quan trọng và hữu ích cho phép người dùng thực hiện các thao tác nhanh như xóa, chỉnh sửa, hoặc đánh dấu yêu thích một mục trong danh sách. Tính năng này không chỉ giúp cải thiện trải nghiệm người dùng mà còn mang lại khả năng tương tác hiện đại cho ứng dụng. Trong bài viết này, chúng ta sẽ khám phá cách thiết lập và tùy chỉnh swipe actions trong UITableViewCell một cách chi tiết và dễ hiểu.
Các bước thực hiện
1. Cài đặt UITableView và UITableViewCell
Trước tiên, chúng ta cần khởi tạo một UITableView và các UITableViewCell cơ bản để hiển thị danh sách dữ liệu.
swift
import UIKit
class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
let tableView = UITableView()
var items = ["Item 1", "Item 2", "Item 3"]
override func viewDidLoad() {
super.viewDidLoad()
tableView.frame = self.view.bounds
tableView.dataSource = self
tableView.delegate = self
tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
self.view.addSubview(tableView)
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return items.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
cell.textLabel?.text = items[indexPath.row]
return cell
}
}2. Thêm Swipe Actions cho UITableViewCell
Chúng ta sử dụng phương thức tableView(_:trailingSwipeActionsConfigurationForRowAt:) để thêm hành động swipe ở phía bên phải của UITableViewCell.
swift
func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
// Tạo hành động xóa
let deleteAction = UIContextualAction(style: .destructive, title: "Xóa") { (action, view, completionHandler) in
self.items.remove(at: indexPath.row)
tableView.deleteRows(at: [indexPath], with: .automatic)
completionHandler(true)
}
deleteAction.backgroundColor = .red
// Tạo hành động chỉnh sửa
let editAction = UIContextualAction(style: .normal, title: "Chỉnh sửa") { (action, view, completionHandler) in
// Thực hiện hành động chỉnh sửa
completionHandler(true)
}
editAction.backgroundColor = .blue
let configuration = UISwipeActionsConfiguration(actions: [deleteAction, editAction])
return configuration
}3. Thêm Swipe Actions cho bên trái của UITableViewCell
Ngoài việc thêm hành động swipe cho bên phải, bạn cũng có thể thêm hành động ở bên trái bằng cách sử dụng phương thức tableView(_:leadingSwipeActionsConfigurationForRowAt:).
swift
func tableView(_ tableView: UITableView, leadingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
// Tạo hành động yêu thích
let favoriteAction = UIContextualAction(style: .normal, title: "Yêu thích") { (action, view, completionHandler) in
// Thực hiện hành động yêu thích
completionHandler(true)
}
favoriteAction.backgroundColor = .orange
let configuration = UISwipeActionsConfiguration(actions: [favoriteAction])
return configuration
}4. Tùy chỉnh giao diện của Swipe Actions
Bạn có thể tùy chỉnh màu sắc và hình ảnh cho các hành động swipe, điều này giúp chúng trở nên thu hút hơn với người dùng.
swift
let deleteAction = UIContextualAction(style: .destructive, title: "Xóa") { (action, view, completionHandler) in
self.items.remove(at: indexPath.row)
tableView.deleteRows(at: [indexPath], with: .automatic)
completionHandler(true)
}
deleteAction.backgroundColor = .red
deleteAction.image = UIImage(systemName: "trash")
let editAction = UIContextualAction(style: .normal, title: "Chỉnh sửa") { (action, view, completionHandler) in
// Thực hiện hành động chỉnh sửa
completionHandler(true)
}
editAction.backgroundColor = .blue
editAction.image = UIImage(systemName: "pencil")Ví dụ đầy đủ
Dưới đây là một ví dụ hoàn chỉnh về việc thiết lập swipe actions trong UITableViewCell:
swift
import UIKit
class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
let tableView = UITableView()
var items = ["Item 1", "Item 2", "Item 3"]
override func viewDidLoad() {
super.viewDidLoad()
tableView.frame = self.view.bounds
tableView.dataSource = self
tableView.delegate = self
tableView.register(UITableViewCell.self, forCellReuseIdentifier: "cell")
self.view.addSubview(tableView)
}
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
return items.count
}
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
let cell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)
cell.textLabel?.text = items[indexPath.row]
return cell
}
func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
let deleteAction = UIContextualAction(style: .destructive, title: "Xóa") { (action, view, completionHandler) in
self.items.remove(at: indexPath.row)
tableView.deleteRows(at: [indexPath], with: .automatic)
completionHandler(true)
}
deleteAction.backgroundColor = .red
deleteAction.image = UIImage(systemName: "trash")
let editAction = UIContextualAction(style: .normal, title: "Chỉnh sửa") { (action, view, completionHandler) in
// Thực hiện hành động chỉnh sửa
completionHandler(true)
}
editAction.backgroundColor = .blue
editAction.image = UIImage(systemName: "pencil")
let configuration = UISwipeActionsConfiguration(actions: [deleteAction, editAction])
return configuration
}
func tableView(_ tableView: UITableView, leadingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {
let favoriteAction = UIContextualAction(style: .normal, title: "Yêu thích") { (action, view, completionHandler) in
// Thực hiện hành động yêu thích
completionHandler(true)
}
favoriteAction.backgroundColor = .orange
favoriteAction.image = UIImage(systemName: "star")
let configuration = UISwipeActionsConfiguration(actions: [favoriteAction])
return configuration
}
}Kết luận
Swipe actions trong UITableViewCell không chỉ cung cấp một cách tiếp cận trực quan để người dùng tương tác với danh sách dữ liệu mà còn cho phép bạn tùy chỉnh phù hợp với nhu cầu sử dụng của ứng dụng. Việc sử dụng các phương thức và API mà iOS cung cấp giúp bạn dễ dàng thêm và quản lý các hành động này. Hy vọng bài viết trên sẽ giúp bạn nắm rõ hơn về cách triển khai và sử dụng swipe actions trong UITableViewCell một cách hiệu quả và linh hoạt.
source: viblo
