web-dev-qa-db-fra.com

Comment puis-je ajouter une barre de recherche au-dessus d'un UICollectionView?

J'aimerais autoriser les utilisateurs de mon application à rechercher des images à l'aide de UISearchBar au-dessus de UICollectionView. Selon ma compréhension, une UICollectionView doit être dans une UICollectionViewController pour fonctionner correctement. Cependant, Xcode ne me laissera pas mettre une barre de recherche dans une UICollectionViewController. Je ne peux pas non plus utiliser une variable UIViewController générique car la vue de la collection ne fonctionnera pas correctement. Comment puis-je atteindre la fonctionnalité que je veux?

9
A Tyshka

CollectionView + SearchBar avec l'implémentation de Swift3 + Storyboard.

Création de la vue d'en-tête:

 Creating the Header View

Création de la barre de recherche:

 Creating the Search Bar

Créer la classe personnalisée de vue réutilisable

 Create the reusable view custom class

Définir la classe personnalisée de vue réutilisable

 Set the reusable view custom class

Créer la sortie de la barre de recherche

 Create the search bar outlet in custom class

Astuce: connectez le délégué de la barre de recherche à la classe COLLECTION VIEW, la sortie de la barre de recherche passe à la classe PERSONNALISABLE DE VUE RÉUTILISABLE

 Connect the search bar delegate to collection view class

Implémente la méthode d'en-tête CollectionView du protocole

    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()

    }

Définir le délégué Searchbar

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

Et enfin, vos méthodes de délégué de la barre de recherche seront appelées dans votre classe CollectionView

//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()
    }
}
27
mourodrigo

Il n'est pas obligatoire d'avoir UICollectionView dans UICollectionViewController. UICollectionView est comme UITableView et peut être ajouté n’importe où. Tout ce que vous avez à faire est d’implémenter les protocoles UICollectionViewDelegate et UICollectionViewDataSource. Vous pouvez suivre le didacticiel suivant En-tête supplémentaire et ajouter une barre de recherche en tant qu’en-tête supplémentaire de UICollectionView.

1
Vishnu gondlekar