search_widget

搜尋小工具

此 Flutter 套件提供了一個搜尋小工具，用於從資料清單中選擇選項。提供基於搜尋文字的項目過濾。

安裝

在pubspec.yaml的dependencies:部分中，加入以下行：

 dependencies :
  search_widget : <latest version>

❔ 使用方法

導入這個類別

 import 'package:search_widget/search_widget.dart' ;

新增搜尋小工具

• 接受資料列表作為輸入
• 用於取得所選項目的選項。傳回所選項目，如果項目被刪除則傳回 null

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

• 彈出清單項目產生器的選項。這基本上會傳回一個小部件以在彈出視窗中顯示為列表項

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

• 根據搜尋查詢過濾資料清單的選項

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

• 為選定清單項目產生器提供的選項，當使用者從彈出清單中選擇項目時啟用該選項

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

• 用於提供自訂文字欄位的選項。接受 TextEditingController 和 FocusNode 作為參數

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

全面實施

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

主要亮點

• 自適應彈出視窗位置可防止彈出視窗隱藏在鍵盤後面

• 如果在 ScrollView 中使用此小部件，則會彈出以滾動手勢滾動的視窗

待辦事項

• 支援 onItemSelected 方法直接傳回所選項目
• 新增選擇多個項目的支持
• 新增可見性布林值以顯示所選項目小工具

我的顫振包

• pie_chart 附有酷炫動畫的 Flutter 餅圖。
• avatar_glow Flutter Avatar Glow Widget，帶有發光動畫。
• json_table 直接從 json 映射建立 Flutter Json Table。
• animating_location_pin Flutter 動畫位置 Pin 控件提供動畫位置 Pin 控件，可在取得裝置位置時使用。

我的顫動應用程式

• flutter_profile 在 Playstore 上展示我的作品集：Ayush P Gupta。
• flutter_sankalan Flutter 應用程序，允許閱讀/上傳短篇小說。

？貢獻

1. 分叉它
2. 建立您的功能分支（git checkout -b my-new-feature）
3. 提交您的更改（git commit -m '添加一些功能'）
4. 推送到分支（git push origin my-new-feature）
5. 建立新的拉取請求