Flutter Tutorial - Search TextField For Local & Network - Search Bar & Search Delegate

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 ธ.ค. 2024

ความคิดเห็น • 46

  • @HeyFlutter
    @HeyFlutter  2 ปีที่แล้ว +1

    This might help you :)
    👉 12 Week Flutter Training from Newbie to Expert: heyflutter.com
    Source Code: github.com/JohannesMilke/search_appbar_example
    App Bar & Transparent App Bar Tutorial: th-cam.com/video/dHBF4IJZvHk/w-d-xo.html
    Calculator UI Tutorial: th-cam.com/video/N8C-cW7u2JA/w-d-xo.html
    Fitness App UI Tutorial: th-cam.com/video/4KQ-f_6Y7p8/w-d-xo.html
    Social App UI: th-cam.com/video/PvDOgOdUgkU/w-d-xo.html
    Todo App From Scratch Tutorial: th-cam.com/video/kN9Yfd4fu04/w-d-xo.html
    Shop UI From Scratch Tutorial: th-cam.com/video/CQZr-GXe__Y/w-d-xo.html
    Chat App With Firebase Tutorial: th-cam.com/video/wHIcJDQbBFs/w-d-xo.html
    Movie App UI Tutorial: th-cam.com/video/aLwjk-G2Qik/w-d-xo.html
    Onboarding UI Screen Tutorial: th-cam.com/video/CQlA2p--oEg/w-d-xo.html

  • @wycliffeo4656
    @wycliffeo4656 2 ปีที่แล้ว

    Fiinished my search bar, thanks man, you also helped me solve an error i was experiencing when i built my first app three years ago, a big thank you my humble like and subscription earned

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Glad you liked it, wycliffe ottawa 😀

  • @alexanderelse4551
    @alexanderelse4551 2 ปีที่แล้ว +1

    Great Video, I really like how you organized your code and that you only have an example of moderate size this really helps to incorporate the concepts in ones own Apps.

  • @TenzinThinley
    @TenzinThinley 3 ปีที่แล้ว

    Wow just what I needed. This is the first proper video on search listview. Thank you

  • @deepaksoundappan3244
    @deepaksoundappan3244 3 ปีที่แล้ว

    superb job.. i dont know how u make such great videos..

  • @Fishycheeze
    @Fishycheeze 3 ปีที่แล้ว

    keep the videos coming love it. gaining so much

  • @carlosjaviersalazarmartine9957
    @carlosjaviersalazarmartine9957 2 ปีที่แล้ว

    Great video, thank you very much!!!

  • @zahrayousefi9400
    @zahrayousefi9400 3 ปีที่แล้ว

    Thanks for this clear explanation

  • @aymanessalai1277
    @aymanessalai1277 3 ปีที่แล้ว +1

    I'm ur first like. Love ur videos btw !

  • @muhammadafzal237
    @muhammadafzal237 2 ปีที่แล้ว

    Hi Johannes!
    Can you do this thing in firebase. I need to search in firestore data.

  • @dewanderers
    @dewanderers 3 ปีที่แล้ว

    content and way to delivery ❤💕

  • @akayabacgil2631
    @akayabacgil2631 3 ปีที่แล้ว

    thank you :)

  • @nannabach9
    @nannabach9 3 ปีที่แล้ว

    Really nice!! Do you have a guide to how I make the search without having to make it full screen? I would like to have it as a dropdown

    • @nannabach9
      @nannabach9 3 ปีที่แล้ว

      @@HeyFlutter The package Flutte-flappy-search is DISCONTINUED 😕

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Thank You Nanna Bach Munkholm! Follow this link: blog.smartnsoft.com/an-automatic-search-bar-in-flutter-flappy-search-bar-a470bc67fa1f
      I hope you will get your answer 🙂

  • @arifmoazy1371
    @arifmoazy1371 3 ปีที่แล้ว

    super helpful

  • @nexoknechthd619
    @nexoknechthd619 3 ปีที่แล้ว +1

    How can I make a custom page for every city?

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Thank you, Nexoknecht HD! 🙂 well that's pretty simple you can create your custom pages and call api for each screen differently instead of searching

  • @mgmyo7066
    @mgmyo7066 3 ปีที่แล้ว

    nice tutorial

  • @prashan-gc
    @prashan-gc 2 ปีที่แล้ว +1

    hi johanness,
    since u removed this following code for the network search:
    final suggestions = query.isEmpty
    ? recentmembers
    : members.where((member) {
    final memberLower = member.toLowerCase();
    final queryLower = query.toLowerCase();
    return memberLower.startsWith(queryLower);
    }).toList();
    and, in the video you are only searching for berlin so the output is showing correct. but when i worked with my api even if I search "california" , its showing me all the places as outputs.
    Am i wrong? please correct me

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Thank you Prashanna GC, make sure to follow the tutorial step by step 🙂

  • @jawadaslam8537
    @jawadaslam8537 2 ปีที่แล้ว

    Unable to change cursor color of search deligate its blue by default and Hint text 'Search'..so how can i change it ..i tried wrapping scaffold with them widget but its not working

    • @jawadaslam8537
      @jawadaslam8537 2 ปีที่แล้ว

      theme*

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Thank you Jawad Aslam, make sure to follow the tutorial step by step 🙂

  • @pierremarais7669
    @pierremarais7669 3 ปีที่แล้ว

    Hi Johannes, thanks again, my question; can you search by using any characters instead of starting with the first charcater

  • @photogenie7298
    @photogenie7298 3 ปีที่แล้ว

    Awesome stuff as always! What i want to know is how to implement this for search query in firebase firestore

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Thanks for your feedback, Photo Genie! 🙂
      You have two options for implementing the search with firebase
      1) You save to save your texts lowercase in firebase. For more info see here: stackoverflow.com/a/56747021
      2) Recommended way! You need to use a service such as Algolia or ElasticSearch. For more details see here: stackoverflow.com/a/49942559

  • @tharoseth8064
    @tharoseth8064 3 ปีที่แล้ว

    Im really like your video.

  • @manikandanm8621
    @manikandanm8621 3 ปีที่แล้ว

    That good. How to search in textfield.

  • @titofrezer6201
    @titofrezer6201 2 ปีที่แล้ว

    Gr8 job bro, but my question is wouldn't be harsh to request the server when each character is clicked?
    Or is there any way of handling this huge resource consumption issue, like implementing debouncing. Thanks for your contribution

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว +1

      Thank You Tito Frezer! Follow this link: stackoverflow.com/questions/51791501/how-to-debounce-textfield-onchange-in-dart
      I hope you will get your answer 🙂

  • @usmannawaz1059
    @usmannawaz1059 2 ปีที่แล้ว

    close(context,null) is not receve (null ) showing error (The argument type 'Null' can't be assigned to the parameter type 'String'.)

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Hello, Usman Nawaz! Follow this link: stackoverflow.com/questions/66798782/error-the-argument-type-string-cant-be-assigned-to-the-parameter-type-stri
      I hope it will solve your problem. Thank You 🙂

  • @deepakchaurasiya519
    @deepakchaurasiya519 3 ปีที่แล้ว

    Sir how to fetch efficiently data from an API which contains list of 10000 objects.
    Getting these large amount of data will reduce complexity.. so please give me an efficient way to solve this problem!

  • @yoapps137
    @yoapps137 3 ปีที่แล้ว

    Worked on this code today. Was really cool.. have a few questions:
    1. why do we need an Opacity Widget at the end of our buildDegrees() in our WebApi call?
    2. I have never seen anything like- json['weather'].first['main']; .... i would usually use something like- json['weather'][0]['main'];... is there a link you can share with accessing a Json array the way you did... seems cool ;-)
    3. In dark mode my searchbox & search Text both are white... I cant see anything... I saw on Git... there seems to be an issue opened... hence Im going without dark mode :-(

    • @yoapps137
      @yoapps137 3 ปีที่แล้ว

      @@HeyFlutter just the fact that you took the trouble to answer me is really admirable. Thanks. And yeah it makes sense now! :-)

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว +1

      1. This is used to align the text properly in the center. The degrees text "°" is on the right side visible and the same text "°" is on the left side invisible. This results in a centered degree number.
      2. Yeah you can also use: json['weather'][0]['main']; it is the same.
      3. Check my new video out about Dark & Light Theme, maybe this helps you! th-cam.com/video/HSAa9yi0OMA/w-d-xo.html

  • @wishiwasamillionaire
    @wishiwasamillionaire 3 ปีที่แล้ว

    Hi Johannes. Your videos are brilliant and I've just subscribed to your chanel. I do have a question about this one. I am trying to implement the same thing from locally stored data within a json file. I have build a model that extracts the data from the json file, but I am not sure how to successfully use that data in a search page like in your tutorial. Thanks!

    • @wishiwasamillionaire
      @wishiwasamillionaire 3 ปีที่แล้ว

      @@HeyFlutter Thanks. I'll give it a go. I've got the search page working, although it just doesn't search. I've made sure each group of my json data has a particular search string, so that's the one I'll use for the searching.

    • @wishiwasamillionaire
      @wishiwasamillionaire 3 ปีที่แล้ว

      @@HeyFlutter I got the search through locally stored json data working perfectly! I'm just thinking, do you know how to modify it to search through stored CSV data, since CSV files have a much smaller size? Or, would it be best to store the data as CSV and parse into json for searching? That just seems quite resource intensive though, especially for larger amounts of data. Thanks :)

  • @abdurrehman6203
    @abdurrehman6203 2 ปีที่แล้ว

    Please Johannes make sure that you provide the code of every video for free, whenever I watched your full videos and want to look up your code then your code are paid, plz make sure that it available for free it will contribute to the community.

    • @HeyFlutter
      @HeyFlutter  2 ปีที่แล้ว

      Thank You Abdur Rehman!. I showed the main functionality, which is important for this package. Learn more about it here: github.com/JohannesMilke/sponsorware