search_widget

Widget de recherche

Ce package Flutter fournit un widget de recherche pour sélectionner une option dans une liste de données. Fournit un filtrage des éléments en fonction du texte recherché.

Installation

Dans la section dependencies: de votre pubspec.yaml , ajoutez la ligne suivante :

 dependencies :
  search_widget : <latest version>

❔ Utilisation

Importer cette classe

 import 'package:search_widget/search_widget.dart' ;

Ajouter un widget de recherche

• Accepte la liste de données en entrée
• Option pour obtenir l'élément sélectionné. Renvoie l'élément sélectionné ou null si l'élément est supprimé

onItemSelected : (item) {
    //Do whatever you would like
    setState (() {
       _selectedItem = item;
    });
 },

• Option pour le générateur d'éléments de liste pop. Cela renvoie essentiellement un widget à afficher comme élément de liste dans une fenêtre contextuelle

popupListItemBuilder : ( LeaderBoard item) {
   return PopupListItem (item);
 }

• Option de filtrage de la liste de données en fonction de la requête de recherche

queryBuilder : ( String query, List < LeaderBoard > list) {
   return list. where (( LeaderBoard item) => item.username. toLowerCase (). contains (query. toLowerCase ())). toList ();
 }

• Option fournie pour le générateur d'éléments de liste sélectionnés qui s'active lorsqu'un utilisateur sélectionne un élément dans la liste contextuelle

selectedItemBuilder : ( LeaderBoard selectedItem, deleteSelectedItem) {
   return SelectedItem (selectedItem,deleteSelectedItem);
 }

• Option pour fournir un TextField personnalisé. Accepte TextEditingController et FocusNode comme paramètre

textFieldBuilder : ( TextEditingController controller, FocusNode focusNode) {
    return TextField (
        controller : controller,
        focusNode : focusNode,
        //... Other customizations here
       );
  },

Mise en œuvre complète

 SearchWidget < LeaderBoard >(
   dataList : list,
   hideSearchBoxWhenItemSelected : false ,
   listContainerHeight : MediaQuery . of (context).size.height / 4 ,
   queryBuilder : ( String query, List < LeaderBoard > list) {
     return list. where (( LeaderBoard item) => item.username. toLowerCase (). contains (query. toLowerCase ())). toList ();
   },
   popupListItemBuilder : ( LeaderBoard item) {
     return PopupListItemWidget (item);
   },
   selectedItemBuilder : ( LeaderBoard selectedItem, VoidCallback deleteSelectedItem) {
     return SelectedItemWidget (selectedItem, deleteSelectedItem);
   },
   // widget customization
   noItemsFoundWidget : NoItemsFound (),
   textFieldBuilder : ( TextEditingController controller, FocusNode focusNode) {
     return MyTextField (controller, focusNode);
   },
 )

Points saillants

• Position contextuelle adaptative pour éviter que la fenêtre contextuelle ne soit cachée derrière le clavier

• Popup pour faire défiler avec un geste de défilement si ce widget est utilisé dans ScrollView

FAIRE

• Prendre en charge la méthode onItemSelected pour renvoyer directement les éléments sélectionnés
• Ajouter la prise en charge de la sélection de plusieurs éléments
• Ajouter un booléen de visibilité pour afficher le widget de l'élément sélectionné

Mes forfaits Flutter

• pie_chart Graphique à secteurs Flutter avec une animation sympa.
• avatar_glow Flutter Avatar Glow Widget avec une animation lumineuse.
• json_table Créez directement une table Flutter Json à partir de la carte json.
• animating_location_pin Widget d'épingle d'emplacement animé Flutter fournissant un widget d'épingle d'emplacement animé qui peut être utilisé lors de la récupération de l'emplacement de l'appareil.

Mes applications Flutter

• flutter_profile Présentez mon portfolio : Ayush P Gupta sur Playstore.
• flutter_sankalan Flutter App qui permet de lire/télécharger des histoires courtes.

? Contribution

1. Fourchette-le
2. Créez votre branche de fonctionnalités (git checkout -b my-new-feature)
3. Validez vos modifications (git commit -m 'Ajouter une fonctionnalité')
4. Push vers la branche (git push origin my-new-feature)
5. Créer une nouvelle demande de tirage