Flutter FutureBuilder | The Right Way

Поделиться
HTML-код
  • Опубликовано: 5 июл 2024
  • How to use the FutureBuilder widget in Flutter. Futures wait for data before displaying the data inside your Flutter app using the FutureBuilder.
    Click here to Subscribe to Johannes Milke: ruclips.net/user/JohannesMilke...
    👉 12 Week Flutter Training | heyflutter.com
    👉 Flutter Masterclass Courses | heyflutter.com/masterclass
    Source Code | github.com/JohannesMilke/futu...
    My Courses | heyflutter.com
    Follow Newsletter | johannesmilke.com/#/newsletter
    SUBSCRIBE HERE
    bit.ly/JohannesMilke
    SUPPORT & SPONSOR ME
    github.com/sponsors/JohannesM...
    TIMELINE
    0:00 Future
    0:22 FutureBuilder
    1:54 setState called multiple times (keeps firing)
    2:43 Refresh FutureBuilder
    3:04 Fix: Keep loading in FutureBuilder
    4:28 ConnectionState in FutureBuilder
    SOCIAL MEDIA: Follow Us :-)
    Twitter | / heyflutter_
    Linkedin | / heyflutter
    #Flutter #Tutorial #JohannesMilke
    LIKE & SHARE & ACTIVATE THE BELL
    Thanks For Watching :-)
  • НаукаНаука

Комментарии • 83

  • @HeyFlutter
    @HeyFlutter  2 года назад

    This might help you :)
    👉 12 Week Flutter Training from Newbie to Expert: heyflutter.com
    Source Code: github.com/JohannesMilke/future_builder
    Stream Builder Tutorial: ruclips.net/video/g8Y1Eqa4pbc/видео.html
    Nested ListViews and Columns Tutorial: ruclips.net/video/ZpHuAbYWL3w/видео.html
    ChatApp UI Design Tutorial: ruclips.net/video/eGhvL082-Pc/видео.html
    Flexible Widget Tutorial: ruclips.net/video/5TwBXLZdVvk/видео.html
    Expanded Widget Tutorial: ruclips.net/video/N1FMX4rDn6Y/видео.html
    Spacer Widget Tutorial: ruclips.net/video/n4dJVUdj4ik/видео.html
    FittedBox Widget Tutorial: ruclips.net/video/WpTMNArnXdc/видео.html
    Flutter Layout Basics Tutorial: ruclips.net/video/yYxueTNIDlA/видео.html
    Row Layout Basics Tutorial: ruclips.net/video/lY5GtNkvyhM/видео.html
    Column Layout Basics Tutorial: ruclips.net/video/nW9pAyDs-wE/видео.html
    Expansion Tile Tutorial: ruclips.net/video/vRWY-IQAin0/видео.html
    Expansion Panel Tutorial: ruclips.net/video/r7L146d9YA8/видео.html
    Bottom Sheet Tutorial: ruclips.net/video/TXYuaiukw7E/видео.html
    Popup Dialog Tutorial: ruclips.net/video/4pn-_md5Ol4/видео.html
    Dropdown Menu Tutorial: ruclips.net/video/z0ihUbwlSHs/видео.html
    PageView Tutorial: ruclips.net/video/sFXg-phkbQU/видео.html
    Page Transition Animation Tutorial: ruclips.net/video/_R3E_aof69c/видео.html
    Horizontal ListView Tutorial: ruclips.net/video/baA_J5tUtEU/видео.html

  • @borbelyviktor3057
    @borbelyviktor3057 2 года назад

    I like your short videos. I always spare some time for them to learn something new or handy. Thanks!

  • @marioluque4786
    @marioluque4786 2 года назад +2

    Awesome Johannes! Please make more videos of good practices like this! Thank you very much!

  • @husseinnasibu
    @husseinnasibu 2 года назад

    This video is by far a great tips of the future builder

  • @sergejsi706
    @sergejsi706 2 года назад +7

    By far the best resource to learn flutter👌

  • @yoapps137
    @yoapps137 Год назад +3

    This is one of my all time favorite videos, because it really apes what happens so often in the real world !

    • @HeyFlutter
      @HeyFlutter  Год назад

      Glad to hear that, Thank you Yo Apps! 😊

  • @samsonorode6568
    @samsonorode6568 Год назад +3

    5 months later and this video save my panic (as my future was been rebuilt on each setstate). Thanks Johannes for this masterpiece ♥

    • @HeyFlutter
      @HeyFlutter  Год назад

      You are welcome, Samson Orode 😊

  • @alexpol108
    @alexpol108 2 года назад +2

    Thanks for the good explanation) keep going

  • @davidfield2030
    @davidfield2030 4 месяца назад

    Really, really helpful !!! Thanks for such a clear explanation.

    • @HeyFlutter
      @HeyFlutter  4 месяца назад

      Glad to hear that, You are most welcome @davidfield2030

  • @arnauduquenoy75
    @arnauduquenoy75 2 года назад +1

    Love theese in depth dart tutos !

    • @arnauduquenoy75
      @arnauduquenoy75 2 года назад

      @@HeyFlutter No ! It’s me who thanks you Milke. You made made me discover good packages that i included to build an app for a school .. that plus your magistral tutos on dart where important for me to overcome a whole business project ! I must admit that state management and project structure and animation and test if i have time :) .. is so hard to achieve that your tutos inspired me.
      If one day you make a tuto on good practice state management and testing in a business scale .. I buy :) i learnt a lot on building an entire app but still need to learn

  • @phyllyf763
    @phyllyf763 Год назад

    You explained it excellently. Thanks much.

    • @HeyFlutter
      @HeyFlutter  Год назад

      You’re most welcome, Phyl lyf! 🙂

  • @serkandemir6733
    @serkandemir6733 2 года назад +1

    Super Video. Weiter so!

  • @Raimkhodzhanov
    @Raimkhodzhanov 2 года назад

    Thank You! It was interesting!

  • @noonesbiznass5389
    @noonesbiznass5389 2 года назад

    Very helpful, thanks!

  • @farhanahmad-bv1mx
    @farhanahmad-bv1mx 2 года назад

    Wonderful Sir

  • @botanmh
    @botanmh 2 года назад

    You are the best as I know

  • @ChrisHalden007
    @ChrisHalden007 2 года назад

    Excellent. Thanks

  • @wilmedysmoraleszayas1081
    @wilmedysmoraleszayas1081 Год назад

    very well explained and every one now can understand this.

    • @HeyFlutter
      @HeyFlutter  Год назад

      Thanks, Wilmedys Morales! 🙂

  • @1234matthewjohnson
    @1234matthewjohnson 2 года назад

    man thank you for breaking down a hard to understand topic so easily!

    • @HeyFlutter
      @HeyFlutter  2 года назад +1

      Glad I could be of help, Thank you Matthew Johnson! 😊

  • @huguesbomo9297
    @huguesbomo9297 Год назад

    thank you so much Johannes

    • @HeyFlutter
      @HeyFlutter  Год назад

      You are welcome, @huguesbomo9297 😊

  • @Machiuka
    @Machiuka Год назад

    Very useful tutorial. Thank you

  • @lucastrinidaddelgado6256
    @lucastrinidaddelgado6256 2 года назад +1

    Great Video 👏

  • @gforcefabi
    @gforcefabi Год назад

    Good explaination!

    • @HeyFlutter
      @HeyFlutter  Год назад

      Glad it was helpful, Fabian A. 😀

  • @SoudHaroon
    @SoudHaroon 2 года назад +1

    Thanks that really help alot 😊

  • @WilsonJoey
    @WilsonJoey 2 года назад +1

    Very helpful.

  • @user-pz5sj5zo8q
    @user-pz5sj5zo8q 7 месяцев назад

    WonderFul Teacher ! .

    • @HeyFlutter
      @HeyFlutter  7 месяцев назад

      Thank you, @user-pz5sj5zo8q! 🙂

  • @fluttermakers
    @fluttermakers 2 года назад +1

    good tutorial thanks bro

  • @mayur16
    @mayur16 2 года назад +1

    Thank you.. keep going..

  • @akzholkadylbek9608
    @akzholkadylbek9608 Год назад

    very useful video

    • @HeyFlutter
      @HeyFlutter  Год назад

      Thank you, @akzholkadylbek9608! 🙂

  • @Kjh812
    @Kjh812 2 года назад

    So Best!

  • @georgeikwegbu5284
    @georgeikwegbu5284 2 года назад

    3rd person to like this video, I'll be the first someday, btw... Your videos are always a bomb.
    ❣️❣️ Much appreciation from 🇳🇬🇳🇬🇳🇬🇳🇬

  • @mohanbabu9723
    @mohanbabu9723 Год назад

    please explain this Future method along with firebase for retrieve data.

  • @codewithbenji
    @codewithbenji 2 года назад

    👍 cool staff

  • @diaaanadani4410
    @diaaanadani4410 2 года назад

    Thx

  • @GauravKumar-lx5vn
    @GauravKumar-lx5vn 2 года назад

    Nice.... 👌🏻👌🏻👌🏻

  • @guilhermelincoln8574
    @guilhermelincoln8574 10 месяцев назад

    our flutter hero

    • @HeyFlutter
      @HeyFlutter  10 месяцев назад

      Glad to hear that, Thank you @guilhermelincoln8574! 😊

  • @evansgitonga3046
    @evansgitonga3046 2 года назад

    Do you have any video on MVVM with Providers?

  • @bhabhayt398
    @bhabhayt398 2 года назад +1

    Search data from local database in implement staggered grid view fetching data

  • @emmanuelbonke7374
    @emmanuelbonke7374 2 года назад +1

    Best practices....
    Could you also describe how to use provider in the best way (consumers)

  • @deardiarydeardiary5723
    @deardiarydeardiary5723 2 года назад

    you save my job

  • @hurbangash1302
    @hurbangash1302 2 года назад

    hello make a complete course in which u make an app with a backend from scratch .and thanks for the video I learnt a lot

  • @mauricevolaski2937
    @mauricevolaski2937 Год назад +1

    One thing I think can be improved is a way to display the progress of data being fetched. Say I am importing 5,000 items and that takes 30 seconds. It would be nice to let the user have some indication of how much progress has been made and roughly when to expect the data, so the user doesn’t think the app is hung. To do this, FutureBuilder should have options for max data size or count and the current iteration, so it can display a progress indicator with actual progress.

    • @HeyFlutter
      @HeyFlutter  Год назад

      Great, Thank You Maurice Volaski

  • @leoMC4384
    @leoMC4384 2 года назад

    Great content.
    Question: I have a FutureBuilder in my app that fetches data from my API, which gets it from different websites. Some are slower than others. If I made one API call and wait for the response, everything is fine. The problem is that if I have an active pending API call and try to do a second one to get different data, I got both widgets but the same data. So Flutter instead of execute the second API call, is just repeating the first one! Why is this happening??? I want my FutureBuilder to wait until other Future os done. Is that possible?? Thanks.

    • @leoMC4384
      @leoMC4384 2 года назад +1

      @@HeyFlutter I fixed it today by chance. The future I was using required information from the instantiated widget and was sended in the initState to an another class to fetch the data. The solution was just to remove the initState, (go back to a Stateless widget) and write the class instantiation for the future in the FutureBuilder statement. That was it. I don't understand why was this happening to be honest but I'm glad I fixed it. Thanks anyway. 😁😁😁

    • @HeyFlutter
      @HeyFlutter  2 года назад

      Thank You Leonardo Cuevas! Follow this link: stackoverflow.com/questions/56249715/futurebuilder-doesnt-wait-for-future-to-complete
      I hope you will get your answer 🙂

  • @shashaneko84
    @shashaneko84 Год назад

    bro u saved me

    • @HeyFlutter
      @HeyFlutter  Год назад +1

      Glad I could be of help, Thank you shashaNEKO! 😊

  • @UGNEWS24
    @UGNEWS24 Год назад

    How can I like this video more than once?

    • @HeyFlutter
      @HeyFlutter  Год назад

      Glad to hear that, Thank you UGNEWS24! 😊

  • @user-xe8vl9eh9l
    @user-xe8vl9eh9l Год назад

    Hi Johannes, I need your help I have to create a app bar with different styles, where whenever I choose the style it has to appear that style like appBar(style: any_style), can you guide me with that please

    • @HeyFlutter
      @HeyFlutter  Год назад

      Thank You s! Follow this link: stackoverflow.com/questions/53658208/custom-appbar-flutter
      I hope you will get your answer 🙂

    • @user-xe8vl9eh9l
      @user-xe8vl9eh9l Год назад

      @@HeyFlutter hi I Johannes the link you shared is not a good help for me, I want different styles in a single appBar where I can change my style based on the style requirement for example appBar (customStyle: roundedBorderStyle), appBar(customStyle:transparentBackground)

  • @flutterquick
    @flutterquick 2 года назад

    Hello @JohannesMilke
    How to display image when the image is clicked?, like Twitter when you tap the image as the image as displayed: how to?
    keep L❤ly tutorial

    • @HeyFlutter
      @HeyFlutter  2 года назад

      Thank You amanuel gulilat! Follow this link: pub.dev/packages/photo_view
      I hope you will get your answer 🙂

  • @zakariahouache5442
    @zakariahouache5442 2 года назад

    Possible example where to use this widget. Thank you sir

    • @HeyFlutter
      @HeyFlutter  2 года назад

      Thanks, Zakaria Houache! 🙂 It can be used everywhere where a Future is returned. A practical example was mentioned at 1:22 where we load some data from the internet.

  • @kevinarnoldpayezamata9870
    @kevinarnoldpayezamata9870 Год назад

    No entiendo mucho de inglés pero se entendió perfectamente

  • @opulencedeveloper
    @opulencedeveloper 2 года назад

    How do you use a future builder in a stateless widget, because I see here that use used initState which is only available in a stateful widget.

    • @HeyFlutter
      @HeyFlutter  2 года назад

      Thank You Bible Perception! Follow this link: stackoverflow.com/questions/64501776/futurebuilder-in-statelesswidget-flutter
      I hope you will get your answer 🙂

  • @cavidanbagiri7837
    @cavidanbagiri7837 2 года назад

    Super. How can l refresh Future Builder with getx?

    • @cavidanbagiri7837
      @cavidanbagiri7837 2 года назад

      @@HeyFlutter Yes Teacher. But another form)). Thanks for everything. Krasava

    • @HeyFlutter
      @HeyFlutter  2 года назад

      Thank You Cavidan Bagiri! Follow this link: stackoverflow.com/questions/64783928/getx-is-not-working-properly-with-futurebuilder-for-update-list
      I hope you will get your answer 🙂

  • @minafaried
    @minafaried 2 года назад

    How do you write the icon in your text widget?

  • @evansgitonga3046
    @evansgitonga3046 2 года назад

    Future not working

    • @evansgitonga3046
      @evansgitonga3046 2 года назад

      @@HeyFlutter I found where the issue was coming from thanks I like your videos

  • @warlockCommitteeMeeting
    @warlockCommitteeMeeting 2 года назад