Flutter UI Design Series | Episode 1 | Flutter UI Design Tutorial

Поделиться
HTML-код
  • Опубликовано: 27 ноя 2024

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

  • @praveenvinopv9929
    @praveenvinopv9929 4 года назад +32

    Wow this was the most useful flutter UI video I ever watched. Thanks to the creator ❤️ for creating this walkthrough like tutorial instead of speed code. He explained about not only about UI widgets but also how to arrange project and things like constant and utils. Thanks man can't wait to see more👍

  • @RetroPortalStudio
    @RetroPortalStudio  4 года назад

    If you find this video useful, consider Following me on:
    Twitter: twitter.com/theretroportal
    Instagram: instagram.com/retroportalstudio
    LinkedIn: www.linkedin.com/in/parasjainrps
    Git: github.com/retroportalstudio
    Happy Coding! ✌️😁

  • @shahrozshahidkhan2866
    @shahrozshahidkhan2866 2 года назад +5

    Amazing! , Your coding style is neat and clean. I love they way you broke the UI into smaller understandable chunks, and explained each of them clearly. Thanks for your hard work , I would love to see tutorials like this more often.

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

    You give a flutter tutorial to us was in one side. But the way you talk during this was simply magnificent bro.Your voice is very cool

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

    Excellent, the detail instructions made this video outstanding comparing to other videos about Flutter UI so far. I really appreciate the author to create such a helpful video from which I learn a lot. Thank you !

  • @vatan2578
    @vatan2578 4 года назад +1

    I look forward to the continuation of your lessons. I wish you and your loved ones health and happiness.

  • @ballerabdude
    @ballerabdude 4 года назад +3

    This was an amazing tutorial. Fast enough to follow and not get lost.

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

    Best tutorial I've ever seen. You've earned yourself a subscriber. Continue this series please?

  • @salihasimov
    @salihasimov 3 года назад +2

    Beautiful video, just what I needed. These tutorials are massively helpful for coders who are inexperienced about UI design. Even though I knew most of the necessary widgets and how they work, I wouldn't just put them together. In these type of videos I get a chance to take a look at your mindset about how to design and create things, and it helps me A LOT. Thank you, so, much my friend.

  • @yaroslavmakarov2218
    @yaroslavmakarov2218 4 года назад +1

    Thanks a lot and let's fooking go to the next ones!

  • @pasindupriyashan385
    @pasindupriyashan385 4 года назад +2

    Best flutter ui series ❤️. Simply describes.

  • @luischodiman7189
    @luischodiman7189 4 года назад +1

    Amazing tutorial. Waiting for Episode 2!

  • @sankethb.k642
    @sankethb.k642 2 года назад +1

    This was super helpful. please continue the series.

  • @olgaivashenko8580
    @olgaivashenko8580 4 года назад +3

    Amazing video! Thank u so much:D I want to start practicing right now.

  • @HusseinMohamed-ej3ch
    @HusseinMohamed-ej3ch 4 года назад +1

    Continue this great series ☺️

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

    Thank you for this informative and educational video!

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

    Excellent video

  • @roslanamir9760
    @roslanamir9760 4 года назад +1

    Great tutorial. I have been developing with Flutter since the start of the year. And I learned a lot about the different widgets in this video.

  • @Amandeep-kq5bz
    @Amandeep-kq5bz 4 года назад +1

    I was waiting for this series... Awesome work.

  • @ismailkoyuncu5518
    @ismailkoyuncu5518 4 года назад +1

    Very good explations sir .. Thanks man can't wait to see more👍

  • @devsadeq
    @devsadeq 4 года назад +2

    Amazing 😍 , please continue ❤️

  • @MarcKronberg
    @MarcKronberg 4 года назад +1

    Thanks for sharing your experience! It helps me a lot!

  • @ba-en1io
    @ba-en1io 4 года назад +1

    Thank you so much for this video. I am starting to learn flutter ui and Im so excited for this series.

  • @footballworld2336
    @footballworld2336 4 года назад +1

    Nice tutorial, Thank you. I will try next screen now.

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

    It's amazing and easily understanding video
    Thank you for best knowledge 🙂

  • @adriangutierrezalonso7828
    @adriangutierrezalonso7828 3 года назад +1

    5 ⭐️ tutorial. Thank you!

  • @SaifyKhan
    @SaifyKhan 3 года назад +1

    great work

  • @joincoder
    @joincoder 3 года назад +1

    Awesome thank for your sharing

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

    Kudos Bro, Simple, Clear, Non-Boaring..! Subscribed+

  • @chrt2308
    @chrt2308 4 года назад +1

    Good Work. Such an awesome explanation with crisp and clear. Mostly useful re-usable components. Can you please do a video on the initial setup of all re-usable components, file setup, git integration, SQLite features, dark-white themes, naming conventions, if possible! I mean a complete explanation as a production-ready code.

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

    Amazing work bro... I love it..

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

    Super video i can see on RUclips Thank u sir Love from Pakistan

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

    Great tutorial content

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

    Your contents are awesome!

  • @yuriboyka3416
    @yuriboyka3416 3 года назад +1

    Your video is really great!

  • @ba-en1io
    @ba-en1io 4 года назад +1

    sir, waiting for your new uploads in this series, thank you

  • @devendravarma5074
    @devendravarma5074 4 года назад +1

    Thanks for starting this series,
    Please focus on building response screen.
    In this video you just had text style different for responsiveness but what about widget's width & height?
    Thanks for the video.

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      Yeah ! I am planning to create a video that focuses on Responsiveness and then will use the concepts throught the series 😅 its kinda hard to explain everything in a single shot!

    • @devendravarma5074
      @devendravarma5074 4 года назад

      @@RetroPortalStudio I really appreciate your efforts. I also know it's very tough to complete everything in a single video, but you are already doing best in it.. thanks for that.😊
      Maybe you can split up a video in multiple parts if you want.. anyways, it's up to you. 👍
      Waiting for responsiveness series too :)

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

    Thanks for this amazing tutorials.

  • @TrikNgonlen
    @TrikNgonlen 4 года назад +1

    great....I love it, Bro!

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

    Thanks Mike!

  • @raouanemohamed2902
    @raouanemohamed2902 4 года назад +1

    Super Always the better

  • @flutterclone1849
    @flutterclone1849 3 года назад +1

    Thank you very much for this beautiful video bro

  • @EugenioSerrano
    @EugenioSerrano 3 года назад +1

    Very useful video. Thanks !!

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

    Wow!

  • @ikbalcan2513
    @ikbalcan2513 4 года назад +1

    really awesome!

  • @ibrarhussain1791
    @ibrarhussain1791 3 года назад +2

    Greatest Tutorial ever professional style of coding, You are not just giving tutorial you are sharing your experience love you bro :*

  • @nuwanmadusanka3911
    @nuwanmadusanka3911 3 года назад +1

    super

  • @XVder
    @XVder 3 года назад

    so easy to follow, thank you

  • @rahulsomani3745
    @rahulsomani3745 4 года назад +1

    Amazing 👌👌👌

  • @skyview059
    @skyview059 3 года назад

    It's really a nice presentation.
    Thank you....

  • @fullstack_journey
    @fullstack_journey 4 года назад +3

    I think adding the direct link to the design inspiration's original Creator's page would be better than Linking to the design curator Instagram account. It'll be better for the original author

  • @fadwafuad4181
    @fadwafuad4181 3 года назад

    amazing explanation.. thanks a lot 🌹 🌹

  • @flutterninja9
    @flutterninja9 4 года назад +1

    Much needed ❤️

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      If you have any suggestions for this series , Feel free to post 'em here ✌😁

  • @AliZahir
    @AliZahir 4 года назад

    Failed to comment yesterday until I saw your video posted on the flutter subreddit r/FlutterDev. www.reddit.com/r/FlutterDev/comments/j54yrp/flutter_ui_design_series_episode_1_retroportal/?
    By far my favorite Flutter RUclipsr. You explain clearly why you do things a certain way and it helps a learner to have a better understand and grasp on programming logic. You efficiently introduced and implemented reusability flawlessly its impressive to see. Your content is quality and very helpful, not in a "watch me code and do as i do type of way".
    Keep up the good work man! Love your videos!

  • @vasanthkumar2190
    @vasanthkumar2190 4 года назад +1

    Nice one !! Great fan of your videos. We can also use chip(s) widget instead of a decorated container for filters right ?Keep doing the good work 😄😄

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      Yes you sure can! There are mostly multiple ways to do the same thing ✌😁

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

    Maybe FloatingActionButton would be a better choice for the map view button..

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

    Love your video ! Can you do how to create real time chart in flutter ?

  • @search_me_tilak
    @search_me_tilak 4 года назад +1

    🔥🔥🔥

  • @altynbek63
    @altynbek63 3 года назад +1

    Great video, man. I want to know how would you implement if we want that Vertical ListView shouldn't overlap with Header views, but have "one" vertical scroll for page?

  • @code_with_amir
    @code_with_amir 3 года назад +2

    I have this problem:
    The parameter 'key' can't have a value of 'null' because of its type, but the implicit default value is 'null'.
    Try adding either an explicit non-'null' default value or the 'required' modifier.dartmissing_default_value_for_parameter

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

      same here but he doesn't dress to that..

  • @spolposat4205
    @spolposat4205 4 года назад +1

    👏

  • @orionprime2543
    @orionprime2543 3 года назад

    hello sir,it seems i'm getting an error when i create the const in Border Box,please help me...appreciating your work from Kenya

  • @afab6427
    @afab6427 3 года назад

    Hello .. i have made this project as well as the bar navigation .. and i want to put them together ,, any tip ? I really need it 🥲

  • @cjeeckazad2995
    @cjeeckazad2995 4 года назад +1

    thanks

  • @MuzamilKhan-rl2sh
    @MuzamilKhan-rl2sh 4 года назад +1

    Well done great tutorial but I don't understand on one thing you use .map after the divider where user select options just give me a little explanation please

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад +1

      Rather than creating each individual item with same structure... we used .map function of list which helps us iterate through the list and with each iteration we are returning a widget. In the end you can see we used .toList() function which finally converts the result of this Map function to a list. And we pass that for the children property

    • @MuzamilKhan-rl2sh
      @MuzamilKhan-rl2sh 4 года назад +1

      @@RetroPortalStudio Thankyou Can we do this for the column as well?

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад +1

      @@MuzamilKhan-rl2sh yes of course but only if the child elements share the same structure ✌😁

    • @MuzamilKhan-rl2sh
      @MuzamilKhan-rl2sh 4 года назад +1

      ​@@RetroPortalStudio Yeah I know and Thanks for your help I just SUBSCRIBED

  • @olyabozhinov8021
    @olyabozhinov8021 3 года назад

    Cool! Thank you for sharing!
    If someone wants to make the buttons on the top with the ripple effect change the build method for Border Icon, you need to wrap the Container in an InkWell ( onTap: () {}, borderRadius: BorderRadius.circular(15.0), child: Container ...

  • @ganyamanish
    @ganyamanish 4 года назад +1

    Friends, I have a technical question, why do you create the ChoiceOption widget as a stateless widget, and not as a method inside the Landing Screen?

  • @soigrames9676
    @soigrames9676 4 года назад +1

    i wonder why dont you put the OptionButton through the "fab" that Scafford offer, is there some bad effect using it?

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      Well, FAB carries out a lot of its properties that are not useful for us in this case. I find it convenient and less troublesome to create custom widgets for such cases ✌😁 There are multiple solutions for the same problem so you can try whichever way you want really

    • @soigrames9676
      @soigrames9676 4 года назад +1

      ​@@RetroPortalStudio thank you for explaining. That make sense, feels like I learned something suddenly.

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

    Plz teach multivendor app with flutter and MySQL plz...vv.imp

  • @yalcinozer4434
    @yalcinozer4434 3 года назад +1

    I'm a React Native developer, designing UI with Flutter looks too complicated to me. I'm not a fan of Facebook as a company but coding UI with JSX is great.

  • @gameofcodes9832
    @gameofcodes9832 4 года назад

    Try to cover responsive principle too

  • @galaxian_hitchhiker
    @galaxian_hitchhiker 3 года назад +1

    Isn’t there a way to do these through a graphical ui designer like using dragNdrop

  • @Randomdude-i8x
    @Randomdude-i8x 3 года назад

    Signal / noise ratio = unlimited

  • @akshatbhat
    @akshatbhat 3 года назад +1

    My text theme is not getting passed to the LandingScreen.dart file, and therefore I am not able to see any text on the screen.. PLS HELP

    • @akshatbhat
      @akshatbhat 3 года назад +1

      I am guessing it is a problem with Theme.of(context), but I have followed all the steps that you have shown including the constants.dart file

  • @hardiksinhjivansia1244
    @hardiksinhjivansia1244 4 года назад +2

    looks like git project is not open source so its hard to follow along with you(i mean it take more time to download asset manually)
    so it would be great if you provide a git project with all necessary assets/constant/ sample data so we can easily follow along

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      It's all there man! 😅 Fonts, Images everything! github.com/retroportalstudio/rps_ui_collection/tree/main/rps_ui_e1

    • @hardiksinhjivansia1244
      @hardiksinhjivansia1244 4 года назад

      @@RetroPortalStudio hey thanks for your reply .
      Idk why I can't clone the given project.
      any idea ?

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      It's a subdirectory as i will be adding all the UI Series tutorials in this very repository. You'll be able to clone this : github.com/retroportalstudio/rps_ui_collection

  • @sanadana145
    @sanadana145 4 года назад

    good UI but brother ... please make this apps fully functional, with data base firebase login siup and cart ..

  • @md.sifulislam6355
    @md.sifulislam6355 3 года назад

    key,height, null found and insist for add required?

  • @hamza-325
    @hamza-325 3 года назад

    Is there any difference between `window.physicalSize` and `MediaQuery.of(context).size`?

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

      window.physicalSize show screen resolution height width And MediaQuery.of(context).size show screen viewport height width

  • @timelinetreasure
    @timelinetreasure 4 года назад

    Why don’t you use firebase for the images bro

  • @mahendranv6264
    @mahendranv6264 4 года назад +1

    How to Return Two or more values from a single function....in Dart?

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      Return a list with multiple values

    • @roslanamir9760
      @roslanamir9760 4 года назад +1

      Or a custom class with each field representing a value.

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

    Try to recall your YT password or hit the forgot password button. We are waiting for you.

  • @marco_di
    @marco_di 4 года назад +3

    Amazing tutorial. But a little too fast to follow

  • @rswinds222
    @rswinds222 4 года назад +1

    I am new in flutter.Can you give me a road map to watch ur all video?

    • @RetroPortalStudio
      @RetroPortalStudio  4 года назад

      Well, I will insist you to start with this Widget Essentials Series ruclips.net/p/PLybADvIp2cxiVOEHi9ooCHP2tAAihHQPX 😁

    • @rswinds222
      @rswinds222 4 года назад

      @@RetroPortalStudio ok.I will

  • @hoggish
    @hoggish 4 года назад

    How about tik tok UI with page view horiontally💕

  • @kamalCode
    @kamalCode 4 года назад

    Sir, e-commerce app in flutter

  • @tanmaysinghal8370
    @tanmaysinghal8370 4 года назад

    Please start from scratch if possible?

  • @samurai284
    @samurai284 3 года назад

    12:33

  • @999NRG
    @999NRG 3 года назад

    anyone who knows backend well and wants to work on a project together?

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

    Source code please anyone?

  • @tanmaysinghal8370
    @tanmaysinghal8370 4 года назад

    Bro this is very fast. Please try to be slow next time.

  • @stunnaman8803
    @stunnaman8803 3 года назад +1

    Too complicated

  • @souvikbera3067
    @souvikbera3067 3 года назад +1

    Bruh stop this fake accent. It's cringy

  • @faheemahmadofficial7701
    @faheemahmadofficial7701 4 года назад

    BRO, YOUR VIDEOS ARE TOO MUCH FREGMENTED PLEASE MAKE THIS EASIER ALSO DO A TO Z SERIES FOR LFUTTER

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

    open GMS window tNice tutorialng, look at blue screen on left, look at it's bottom right corner where for you it might say "Aggressive TE". click the