Search/Filter ListView in Flutter using GetX || Flutter || GetX

hi my name is amar in this video i will discuss how to filter list view in flutter using gatex as you can see in the output this is the list view where a list of player has been displayed with the countries and if i filter here suppose i am writing virat then you can see the list has been filtered how to achieve this in flutter using get x that portion i will discuss today now this is the project which i have created using the gate cli tool after creating the project in the home controller you can see i have created a list of players with their name and countries now here i will declare a variable rx of list of map string comma dynamic i will give the variable name as found players equals to let me copy this paste it here and let me initialized it with empty value right now what i will do is that in the on init method i will write found players dot value equals to all players means the initial value of found players will be equal to the value which has been assigned to all players right now here i will create a method to filter the list void let me give the method name as filter player and i will filter the list with the player name so i will pass the player name here now here i will declare a variable let me copy this let me paste it here let me give the variable name as results equals to let me initialize it with empty value now here i will check if player name dot is empty means if the player name does not contain any value then the variable result will contain the same value which has been assigned to all players now in the else portion here i will write results equals to all players dot where means else portion will execute when if the player name contains the value this means in the else portion i need to filter this all player list based on the player name so here i will write where element then element of name dot to string dot to lower case dot contains and in the contents i will write player name dot to lower case then dot to list right and here i will write found players dot value equals to results means the value which has been assigned to results that will be stored to the found players variable right now let me move to the home view in the home view you can see here in the body i have taken a padding visit and i have given a padding of 10 from all sides then as a child i have taken a column visit in the children i have used a size box then here i have taken a text field as you can see here right and after that i have again taken a size box and in the expanded as a child i have taken a obs widget and in the obvious widget i have taken the list view in the list view i have specified the item count as 30 in the item builder i have used a list style and in the list style in the title property i have used a text visit where name text has been displayed and in the subtitle the country text has been displayed now let me make changes to this view now here in the text field i will use unchanged because the list will be filtered whenever the user starts typing to the text field so here i will write unchanged value controller dot here i will call the method filter player and here i will pause value this means whatever value we are typing to this text field will be passed to the filter player method right now in the list view in the item count i will write controller dot found players dot value dot length after that in the item builder for the first list style and for this text here i will display the player name so instead of writing name here i will write i will write here controller dot found players sorry dot value then i will use index and here i will use which property i will use the name property similarly in the subtitle here i will simply copy this and i will paste it here and instead of name i will display the value from country now let me run the project and this is the output now suppose here i start typing glenn then you can see the list has been filtered and glenn maxwell has been displayed with the name and the country this is how we can filter the list view in flutter using get x don't forget to subscribe my channel thank you so much for watching

Channel: Ripples Code

Views: 15,459

Keywords: flutter getx tutorial, getx tutorial, state management using getx, mastering getx, getx tutorial for beginners, getx tutorial step by step, route management getx, dependency management getx, what is getx, why to use getx, advantages of getx, filter listview in flutter, search listview in flutter, filter/search listview in flutter using getx, filter listview in flutter using getx complete example

Id: yLfMxIt80lk

Length: 6min 22sec (382 seconds)

Published: Mon Feb 14 2022