Tôi làm cách nào để thêm thanh tìm kiếm phía trên UICollectionView?

Question

Tôi muốn cho phép người dùng ứng dụng của tôi tìm kiếm hình ảnh bằng cách sử dụng UISearchBar phía trên một số UICollectionView. Theo sự hiểu biết của tôi, một số UICollectionView phải ở trong một số UICollectionViewController để hoạt động bình thường. Tuy nhiên, Xcode sẽ không cho phép tôi đặt thanh tìm kiếm trong một số UICollectionViewController. Tôi cũng không thể sử dụng chung UIViewController vì chế độ xem bộ sưu tập sẽ không hoạt động đúng cách. Làm thế nào tôi có thể đạt được các chức năng mà tôi muốn?

Answer 1

Không bắt buộc phải có UICollectionView bên trong UICollectionViewController. UICollectionView giống như UITableView và có thể được thêm ở mọi nơi. Tất cả những gì bạn cần làm là thực hiện các giao thức UICollectionViewDelegate và UICollectionViewDataSource. Bạn có thể làm theo hướng dẫn sau Supplementary Header và thêm thanh tìm kiếm làm tiêu đề bổ sung của UICollectionView.

Answer 2

Bộ sưu tậpXem + Tìm kiếmBar với Swift3 + Bảng phân cảnh triển khai.

Tạo Header Xem:

Tạo Search Bar:

Tạo quan điểm tái sử dụng lớp tùy chỉnh

Đặt giao diện tùy chỉnh tái sử dụng lớp

Tạo ổ cắm thanh tìm kiếm

Trick: Nối tìm kiếm thanh đại biểu đến lớp THU VIEW, ổ cắm thanh tìm kiếm đi vào XEM CLASS CUSTOM SÀI LẠI

Thực hiện các phương pháp tiêu đề CollectionView của giao thức

override func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView { 

     if (kind == UICollectionElementKindSectionHeader) { 
      let headerView:UICollectionReusableView = collectionView.dequeueReusableSupplementaryView(ofKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "CollectionViewHeader", for: indexPath) 

      return headerView 
     } 

     return UICollectionReusableView() 

    } 

Đặt các đại biểu Searchbar

class MyCollectionViewController: (other delegates...), UISearchBarDelegate { 

Và cuối cùng, các phương pháp đại biểu thanh tìm kiếm của bạn sẽ được gọi trong CollectionView Lớp

//MARK: - SEARCH 

func searchBarSearchButtonClicked(_ searchBar: UISearchBar) { 
    if(!(searchBar.text?.isEmpty)!){ 
     //reload your data source if necessary 
     self.collectionView?.reloadData() 
    } 
} 

func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) { 
    if(searchText.isEmpty){ 
     //reload your data source if necessary 
     self.collectionView?.reloadData() 
    } 
}