search_widget

Widget de búsqueda

Este paquete Flutter proporciona un widget de búsqueda para seleccionar una opción de una lista de datos. Proporciona filtrado de elementos según el texto de búsqueda.

Instalación

En la sección dependencies: de tu pubspec.yaml , agrega la siguiente línea:

 dependencies :
  search_widget : <latest version>

❔ Uso

Importar esta clase

 import 'package:search_widget/search_widget.dart' ;

Agregar widget de búsqueda

• Acepta lista de datos como entrada
• Opción para obtener el artículo seleccionado. Devuelve el elemento seleccionado o nulo si se elimina el elemento

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

• Opción para el generador de elementos de lista emergente. Básicamente, esto devuelve un widget para mostrarlo como elemento de lista en una ventana emergente.

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

• Opción para filtrar la lista de datos según la consulta de búsqueda.

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

• Opción proporcionada para el generador de elementos de lista seleccionados que habilita cuando un usuario selecciona un elemento de la lista emergente

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

• Opción para proporcionar TextField personalizado. Acepta TextEditingController y FocusNode como parámetro

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

Implementación completa

 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);
   },
 )

Aspectos destacados clave

• Posición emergente adaptable para evitar que la ventana emergente se oculte detrás del teclado

• Ventana emergente para desplazarse con gesto de desplazamiento si este widget se usa dentro de ScrollView

HACER

• Brindar soporte para el método onItemSelected para devolver los elementos seleccionados directamente
• Agregar soporte para seleccionar varios elementos
• Agregue un bool de visibilidad para mostrar el widget del elemento seleccionado

Mis paquetes de Flutter

• pie_chart Gráfico circular de Flutter con animación genial.
• avatar_glow Flutter Avatar Glow Widget con animación brillante.
• json_table Cree la tabla Flutter Json directamente desde el mapa json.
• animating_location_pin El widget de pin de ubicación animado de Flutter proporciona un widget de pin de ubicación animado que se puede usar mientras se busca la ubicación del dispositivo.

Mis aplicaciones Flutter

• flutter_profile Muestre mi cartera: Ayush P Gupta en Playstore.
• flutter_sankalan Aplicación Flutter que permite leer/cargar historias cortas.

? Contribución

1. bifurcarlo
2. Crea tu rama de funciones (git checkout -b my-new-feature)
3. Confirme sus cambios (git commit -m 'Agregar alguna característica')
4. Empujar a la rama (git push origin my-new-feature)
5. Crear nueva solicitud de extracción