📱Minimal Login UI • Flutter Tutorial ♡

Поделиться
HTML-код
  • Опубликовано: 23 апр 2022
  • 📱 Flutter Courses • mitchkoko.app/
    💰 Hire Me / Book Consultation Call • mitchkoko.gumroad.com/l/CallW...
    🎧 Flutter Pod • / mitchkoko
    ~ ;
    📱 TIKTOK • @createdbykoko
    📱 INSTAGRAM • @createdbykoko
    💻 GITHUB • github.com/mitchkoko/
    🖥 WEBSITE • mitchkoko.app/
    firebase flutter sql ios android development app mobile cross platform ui design flutter java login screen tutorial minimal clean dribbble programming coding
    #flutter #createdbykoko
  • НаукаНаука

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

  • @createdbykoko
    @createdbykoko  11 месяцев назад

    🔥📱 Flutter Templates • mitchkoko.app/
    🥷🏽📱 Minimal Social App • mitchkoko.gumroad.com/l/MinimalSocialApp
    💰📱 Minimal Ecommerce App • mitchkoko.gumroad.com/l/MinimalEcommerceApp

  • @AdityaBolt
    @AdityaBolt 2 года назад +168

    Make sure to Wrap your column in a singlechildscrollview to avoid an overflow error when the on-screen keyboard appears.

    • @createdbykoko
      @createdbykoko  2 года назад +28

      This is an amazing tip. Thank you

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

      @HKS Seng No

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

      I didn't know about it, thanks for commenting.

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

      thank you, sir!

    • @kahanx10
      @kahanx10 Год назад +2

      You can also set the resizeToAvoidBottomInset property of a Scaffold to false, in order to avoid the resizing of screen when opening the keyboard, it works when you don't need to scroll but want to have the screen fixed at one place. I still prefer CustomScrollView.

  • @Coenie-je6pn
    @Coenie-je6pn 18 дней назад +1

    Dude I love your approach. No bs, straight to the point.

  • @pachenko2001
    @pachenko2001 2 года назад +9

    Bro!!! Your tuts are off the charts!! I have high hopes of getting so much better at flutter just following you chief. Thanks for all the work and God bless you!💗💗💗💗❣❤‍🔥❤‍🔥👍👍👍👍

  • @AdityaBolt
    @AdityaBolt 2 года назад +33

    Hey container's have a built in padding property so try to avoid using padding widget in the child of the container, makes the code cleaner. Also for the padding widget outside the container(parent widget) try using the margin property of the container instead. Finally you could achieve the same text fields with the decoration property of the textinput field without the need of a container as a parent widget.

    • @createdbykoko
      @createdbykoko  2 года назад +15

      thank you for the margin tip! I will definitely adopt that one. And yeah you are right about the decoration property in the textfields 😂 i was just lazy because im too familiar with the container decoration. Thank you for the feedback though it means a lot 👨🏽‍💻❤️❤️❤️

  • @m.abelkouri4588
    @m.abelkouri4588 2 года назад

    you're so talented bro

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

    Thank you! This is super helpful, as I'm learning Dart & Flutter :D

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

      No worries 😉 glad it helps 👨🏽‍💻

  • @coltonsconyers1604
    @coltonsconyers1604 Год назад +10

    Teaching myself Dart/Flutter with zero coding background whatsoever. You’re videos make it feel like a much more easily achievable goal. Gained a subscriber from me!

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

    Great video dude!!!!

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

    thank you that helped a lot , greetings from Tunisia

  • @nyinyijnine
    @nyinyijnine 10 месяцев назад +1

    thank you so much ko ko, i started learning flutter with Mitch Ko Ko, 5,9,2023

    • @createdbykoko
      @createdbykoko  10 месяцев назад +1

      Haha my pleasure bro. ❤️

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

    Fire tutorial as always.

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

    Nice Work!

  • @MohamedAhmed-ys2np
    @MohamedAhmed-ys2np 2 года назад +1

    Very simple and helpful ❤️

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

    Great channel, I've been looking for it for a long time

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

    Thanks mate!

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

    best tutorial on youtube ever

  • @lamnhat76
    @lamnhat76 6 месяцев назад

    Oh thank you for sharing

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

    Nice work!!. thank you

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

    This is my favorite creator so far, simple and very clean coding. looking forward for your future video. i am learning flutter and following your video

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

    thank you for your great effort. Loves from Egypt ❤

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

      Thanks for the comment. Means a lot to me hehe. EGYPT!!! i love SALAH hahaha

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

    Very helpful your video.Thank you brother❤

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

    Well done. Nice

  • @ivanov-sasha
    @ivanov-sasha 2 года назад

    Awesome! Thanks great!

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

    Great work bro

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

    That was great video mitch, really appreciate your work. Can you also include a darkmode version of the UI in your upcoming if possible? I can design a screen with good enough ui and ux but designing a same page for the darkmode feels redundant and time consuming. Would mean alot if you can make a video on theming a screen for both light and darkmode. Thankyou again man, your videos really helped me step-up my design game.

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

      You can use the theme property for your MaterialApp widget, check it out

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

      Check out the Theme in the material app. you can specify LIGHT or DARK there :D let me know how it goes

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

    good job👏

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

    waiting for the next video, i really want to learn firebase from you

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

      a lot of firebase stuff coming on the way!

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

    This is really amazing. Please can you do a video on how to access different permissions on your phone like fingerprint auth, facial recognition, access to device files and contacts

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

      i think he has this in his course already....maybe

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

    Thank you for your videos, amazing!
    Wondering you would be able to share the source code for this or the end of this Firebase series.

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

    Brother, good job.......❤️

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

      thanks Supun! glad you like it ❤️

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

    Bro, thanks for the video. But which video is for setting up firebase on Android? I can't see it

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

    Thanks

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

    Hey, thanks for the hard work u put in doing these videos for us, i appreciate, and i was asking for a favor, if u can create an Audio Playing app, but the Audio files should be from the server. I'll be glad to see u make it happen.

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

      thanks for the comment :D I will look into that

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

      @@createdbykoko thanks for your time... it means alot.

  • @kamohelolebona4666
    @kamohelolebona4666 Год назад +2

    Where the hell have you been all my life when i needed someone to help with Flutter,Your content is amazing ❤‍🔥

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

      haha welcome. Btw i made a more updated login UI here ruclips.net/video/Dh-cTQJgM-Q/видео.html

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

    loved it

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

    I just fall in love with your videos, I am watching all your videos and loving it !!!!!

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

      Hey welcome bro! 👨🏽‍💻❤️

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

    thanks alot, it's easy to follow

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

    Bro I am facing error while creating container to test field
    If I click wrap with container for test field
    It gives lot of error plz help me out

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

    many thanks bro 🌷
    can you make an email verification video!

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

    It's beautiful 😭

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

    Amazing tutorial, you've helped me so much! and bonus your voice is so soothing

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

    What a great video, awesome how you did it look easy! thanks!

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

      glad u like it alejandro! 💜 hows flutter going for you so far?

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

    Dude you amazing 🔥🔥 keep going i like your work 👌

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

    Thank you bro! it helped me a lot!

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

    Hey man,
    Is your website created with flutter????
    If yes... Can you please make a tutorial on animate on scroll 🙏🙏🙏🙏

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

    Nice video! It's amazing
    How did you do when you change the class ClassName and all the sane ClassName changes when you edit the ClassName?

  • @ai-bloggers
    @ai-bloggers Год назад

    🚀🚀🚀🚀

  • @Ok-Chance
    @Ok-Chance Год назад

    Hi , is this ui still work on others devices ? i mean in a small phone for exemple ! is the button will still appear in the screen

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

    nice!

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

    Estimated Mitch Koko, could you make a tutorial showing how to use the phone's camera to scan barcodes?

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

      Yes I was thinking of making a video about the camera scanning QR codes. might be similar for barcode

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

      @@createdbykoko Ohhh nice, thank you so much

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

    i want master React and Flutter both technologies,
    is it worth ?
    how could i practice both ?

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

    Lovely bruh

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

    WERE IS THE SETUP FOR ANDROID SIR PLEASE

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

    bro i love you bro so much

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

    Hey, Really Nice video. Can I get the code link of this video ?

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

    More than Amazing Thank you.

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

    ❤️❤️🔥

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

  • @krystlertabinas3151
    @krystlertabinas3151 11 месяцев назад

    I had bebasNeue inputted on the fonts, its already in pubspec and imported already but its not showing the same font as yours

    • @tirek_tech
      @tirek_tech 5 месяцев назад

      same , what did you do?

  • @teeratphoowaborwornphimkul3501

    This video is master everyone love like this … he talk a little bit and coding immediately Good Course !!!!

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

      Haha glad you like it 👨🏽‍💻❤️

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

    Thanks!

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

    I'm from Argentina. Thank so much for every video bro!!!

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

      My pleasure! I was supporting argentina in the world cup but tough loss haha 🇦🇷🇦🇷🇦🇷❤️

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

    If i want to use TextFormField can i just simply change the TextField to TextFormField?

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

    Code?

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

    hey can you tell me name extension how to choose background color

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

      No extension Lukman, just go to the settings of VSCode and you can set the theme there

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

    Very helpful, Thanks

  • @ai-bloggers
    @ai-bloggers Год назад

    You are the best, bro

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

    All your tutorials are the best!!!
    Please Mitch Koko, You mind sharing the designs link to this UI?

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

    Perfect 👍

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

    Thank you

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

    how to use on pressed in login section

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

      Hey I want to help but can you clarify your question? Also you might want to check out my next Login video, it may answer your questions ruclips.net/video/TkuO8OLgvkk/видео.html 👨🏽‍💻❤️

  • @ravshanparpiyev9685
    @ravshanparpiyev9685 20 дней назад

    Well

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

    What hotkey do you use in vscode to automatically format with new lines and tabs?

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

      Control + S = if you save it it automatically reformats for me

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

      @@createdbykoko yeah that’s what it looked like. I guess I am missing some formatting setting in vscode

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

      @@garretthaynes1994 try just updating VScode. I’m pretty i dont have any extra settings enabled

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

      I found the “format on save” setting in vscode

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

    Thanks for your videos. Benefit a lot. And I really wanna know how to make the rotate animation of the mobile at the begin of the video.

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

    thank you sir

  • @h3w45
    @h3w45 15 дней назад

    thumbnail and end result are not the same!

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

    Hey Mitch, been following you for a while. Your video thumbnail is misleading. You don't show how to make that frosted glass UI with Google and Apple login options. A bit disappointed, but thank you for the tutorial on the simple login.

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

    Cool.

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

    dont forget the "forget password ?"
    nice tuto tho ty

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

    Can you give me a tutorial on instagram login? Plzzzzzz.

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

      yea sure. you want the instagram login UI?

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

      @@createdbykoko brother, I do not understand.🤔

  • @zyltho
    @zyltho 11 месяцев назад

    i have alot of errors why?

    • @createdbykoko
      @createdbykoko  11 месяцев назад

      What do the errors say?

    • @zyltho
      @zyltho 11 месяцев назад

      @@createdbykoko not on login ui sorry i got it in on app intruduction when i write class Homepage and stuff and the website i forgot what its called lollei it was something like that those commands where i write these website completely says error the red line show up under both error i mentioned before

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

    Hi, can you please do one video on how to access native components like accessing camera to scan QR code, reading contacts, share on WebView page?
    Currently inside my flutter app it's rendering external webpages. Now, when user clicks on button on that webpage I would like to read/enable the above native components from that webpage.
    How can achieve this? Please advise!!

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

    what are the flutter extension you use in VsC....when you select bunch of options come

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

    Is there a way to add a local jpeg, png, etc instead of Icon()?

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

      Of course! You can bring in an image using this widget ruclips.net/video/6TmpjwKX9AU/видео.html

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

    Hello, wow nice design, can i get the github link please, if you won't mind?

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

    bro plzz can u telll me what u use to auto align the code

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

    any tutorial for live phone in left side of your monitor?

  • @veenakumari.s8251
    @veenakumari.s8251 Год назад

    Yesterday I implemented this code it was working fine but now the data is not storing in the firebase may I know why plss Rply

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

    Why use padding margins etc when you can size the widgets based on the devices size. Is that a legitimate way to approach?

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

      How would you do that?

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

      @@createdbykoko I made a function that using the BuildContext object you can retrieve for example the width of the screen with MediaQuery. You can also get the screen height the same way and get the safearea height with some subtraction. Try googling some of what I wrote here since I can't write it all out on my phone, many stackexchange threads on it. I'm developing for multiple devices and both tablets and phones, so for example a padding inset of 20 is fine on the phone but on a tablet it looks wrong obviously.
      Though maybe I'm over complicating which is why I ask. I'm new to flutter dev. But have seen similar in other applications. My basic idea is I just want things to size based on the width and height of the current screen. Am I on the right track?

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

      @@The2Coolest2 oh I see, check out my responsive UI tutorial ruclips.net/video/9bo1V9STW2c/видео.html

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

      @@createdbykoko Thanks. Will do!

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

    Backgound music name please sir

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

    for the algorithm :D

  • @veenakumari.s8251
    @veenakumari.s8251 Год назад

    Hii can u share the source code for firebase series..

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

    Use "child: TextFormField" instead of "child: TextField" and you will see lots of warnings dissapear.

  • @gameswelike4056
    @gameswelike4056 11 месяцев назад

    I fall in love with ur video but when I practice as u did I get this error when entering the code for email textfield
    I expected to find ‘,’ is this an error of the vs code or am messing somewhere I can’t continue from there when I continue I get more error

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

    What abt the thumbnail login screen ?

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

      It’s here newer video: ruclips.net/video/Dh-cTQJgM-Q/видео.html

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

    not a good one, the next time make sure to include the creation of the loginpage in the tutorial too

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

      This is the UI for the login page. Here is the next video which covers the functionality/backend ruclips.net/video/TkuO8OLgvkk/видео.html

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

    can u help me guys, i change the fontfamily using google font but not working? why? i already add google_font on pubspec and i already import but still not working, please help me guys

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

    How you just doing all this without main function declaration lol I'm getting error for real 💀

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

    Gosh! Why I wasted time learning android and WPF when i could just learn flutter...
    First impression: commas everywhere lol