Multiple Selection với TableView and CollectionView trên iOS 13

Bài đăng này đã không được cập nhật trong 4 năm

Giới thiệu:

WWDC 2019 đã giới thiệu một chức năng mới dành cho UItableViewCell. Bạn có thể cho người dùng có thể sử dụng 2 ngón tay và vuốt để chọn các item nhanh hơn trên UITableView hoặc UICollectionView.

Mục tiêu:

Sử dụng MultiSelection để select item trên TableView hoặc CollectionView.
Triển khai chức năng này với project mẫu

Hiểu được MultipleSelection Gestures:

Trong iOS 13, các ứng dụng có tính năng này sẽ giúp người dùng có thể nhanh chóng chọn được nhiều item. Ví dụ khi TableView hoặc CollectionView nhận ra có hai ngón tay chạm vào, ứng dụng sẽ tự động cho phép người dùng vuốt hai ngón tay để chọn nhiều item.

Bắt đầu với project mẫu:

Mở Xcode và tạo dự án Xcode mới. Chọn Single View App và nhấp vào next.
Đặt tên cho project và khởi tạo.

Implementation:

Đầu tiên ta xoá ViewController mặc định trong Main.storyboard và add vào một TableViewController và sẽ thêm NavigationController vào. Tiếp theo ta check vào ô Is Initial View Controller cho NavigationController để khi khởi động ứng dụng sẽ chạy đúng màn hình này.

Bây giờ chúng ta di chuyển đến file ViewController.swift để code. Ta phải chắc chắn rằng ViewController đã được kế thừa từ UITableViewController.

Implementing Multiple Selections in TableView:

navigationItem.rightBarButtonItem = editButtonItem
tableView.allowsMultipleSelectionDuringEditing = true

Để sử dụng multiple selection trên tableView, ta set true cho thuộc tính allowsMultipleSelectionDuringEditing của tableView và thêm edit button trên navigationItem.

Thêm Delegate Method:

// 1
override func tableView(_ tableView: UITableView, shouldBeginMultipleSelectionInteractionAt indexPath: IndexPath) -> Bool {
return true
}
// 2
override func tableView(_ tableView: UITableView, didBeginMultipleSelectionInteractionAt indexPath: IndexPath) {
self.setEditing(true, animated: true)
}
// 3
override func tableViewDidEndMultipleSelectionInteraction(_ tableView: UITableView) {
print("\(#function)")
}

Ở hàm delegate này chúng ta return true để cho phép người dùng có thể sử dụng chức năng multiple selection bằng cách vuốt 2 ngón tay.
Hàm delegate này sẽ cho ứng dụng biết được người dùng bắt đầu sử dụng hai ngón tay để vuốt đồng thời chức năng edit sẽ được enable.
Hàm delegate này sẽ cho ứng dụng biết được người dùng đã dừng vuốt hai ngón tay để chọn item.