Modern Bottom Nav Bar📱Flutter Tutorial ♡

แชร์
ฝัง
  • เผยแพร่เมื่อ 22 ต.ค. 2024
  • 💰 I'll develop your MVP app: mitchkoko.app/mvp
    📱 Code: mitchkoko.app/
    🎓 Flutte Beginner Course: • 📱 FULL Flutter Beginne...
    💌 Email: business@mitchkoko.app
    ~;
    / createdbykoko
    / createdbykoko
    / createdbykoko
    / mitchkoko
    ~;
    Google Navigation Bar Flutter
    Package here: pub.dev/packag...

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

  • @createdbykoko
    @createdbykoko  2 ปีที่แล้ว +5

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

    • @Virandayaratne
      @Virandayaratne ปีที่แล้ว

      Is it possible to maintain two navigations in the same app, left side for display all and bottom to display few but using heavily? Is it possible ?

  • @SukiBuild
    @SukiBuild 8 หลายเดือนก่อน +6

    You, my guy, are a real G! Genius! My new favorite channel

  • @JayNirmalkarx
    @JayNirmalkarx 2 ปีที่แล้ว +22

    Please make video player app please...🥺

  • @ht_ghauri
    @ht_ghauri หลายเดือนก่อน +2

    I need to download your whole channel from the database man, Really top G

  • @aristidesminota3709
    @aristidesminota3709 ปีที่แล้ว +5

    Easy explain and quickly, thanks !

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

      My pleasure bro glad u like it

  • @michaelschafferAT
    @michaelschafferAT 8 หลายเดือนก่อน

    Super compact and helpful information once again.
    But I wanted to show the notification badge on the page like in the animation. But can't find that. Does the package perhaps not support this out of the box?

  • @amjadzayed5651
    @amjadzayed5651 2 ปีที่แล้ว +4

    looks very nice, thank you

  • @ARCYCRIN
    @ARCYCRIN ปีที่แล้ว +4

    Bro I like the way you explain, very simple and really cool. Thanks, I'm subscribing, I'm looking forward to more cool videos.

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

    Easy and perfect explain!

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

    How do you make the dummy phone presentations, like the one at the end? It looks cool!

  • @pchasco
    @pchasco ปีที่แล้ว +4

    I like this design, but isn't it somewhat bad UX given that the label for the tab isn't visible until AFTER you open that tab? The point of the label is so that you can find the tab you're looking for. If it isn't visible until after you click on it, it serves little function.

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

      That's a good point! With that said I love having the bottom nav bar with purely icons anyway (and no labels). That's just my preference though, but as you pointed out it's always good to question the UX of designs to see if it's practical 💜👍🏽

  • @aswink7856
    @aswink7856 7 หลายเดือนก่อน

    Thanks man.. It really helped me

  • @mmathems395
    @mmathems395 ปีที่แล้ว

    Hi Mitch ... Thank you for this content as I am seeking a nav-bar solution and maybe this one will do the job. I need say that the record level of your video is quite high so that the sound of your voice triggers bass distortion.

  • @TariqJavaidChaudhry
    @TariqJavaidChaudhry 2 ปีที่แล้ว +4

    Hey Mitch, I supported you by buying your course, please let me know if we can connect 1:1 to dive deeper into it. Keep growing...

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

    Hi Mitch, I just watched all the way thru and it was the screen-switching technique that I wanted to see and compare. Would you have an example of this aspect anywhere please?

    • @createdbykoko
      @createdbykoko  ปีที่แล้ว

      Hey! You might want this one: th-cam.com/video/qk-a_Qgc6b0/w-d-xo.html let me know if this helps

    • @mmathems395
      @mmathems395 ปีที่แล้ว

      @@createdbykoko Hi Mitch, thank you for your response. This video was very helpful. I like the range of examples that you showed here. Excellent content : )

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

    make a tutorial for this package for the navigaton buttons and the pages pls

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

    Thank You So Much
    Clean Work.

  • @MustafaACIRCI
    @MustafaACIRCI 10 หลายเดือนก่อน

    Hi Mitch First of all, thank you. there is a problem. I don't know if you have tried the widget on a real phone, but when I tried it, I had problems with the tab selection sensitivity. I sometimes felt the need to press a button 3 times. I wonder what's the problem?

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

    Thanks buddy, it was so helpful!

    • @createdbykoko
      @createdbykoko  ปีที่แล้ว

      No problem! Glad it helps you 💜👍🏽

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

    The problem is while pressing back button in 2nd or 3rd of bottom navigation page the app exited .for instance in Gamil ,TH-cam if it's not the 1st page the app will always get back to the first page when poping screen from other bottom navigation pages

  • @zianmusic-wg6jd
    @zianmusic-wg6jd 2 หลายเดือนก่อน +1

    I love you man❤

    • @createdbykoko
      @createdbykoko  2 หลายเดือนก่อน

      @@zianmusic-wg6jd 😘

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

    nice tutorial,am really grateful. please how wil can use image instaed of icon in the gbutton?

  • @Ramaihaholic
    @Ramaihaholic 5 หลายเดือนก่อน

    my question would be. how do i link those buttons to specific urls

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

    Nice tutorial!!

  • @rabbitcafe
    @rabbitcafe 8 หลายเดือนก่อน

    Please how to keep gnav when change page? such as cupertinoScaffold cupertinoTabBar.

  • @99Points
    @99Points 2 ปีที่แล้ว

    bro, how many programming languages you know and since when are coding?

  • @inlessthan10
    @inlessthan10 4 หลายเดือนก่อน

    Great video man. Get a pop filter for your mic

  • @j.k24
    @j.k24 ปีที่แล้ว

    yoyo, i wonder, is it possible to create customizable items for users to add manually?

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

    thankssss!!

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

    Hi mitch, I am new in flutter, i followed the same code as you, but the onTapChange is giving me error about not a constant expression. I don't understand why it is giving me this error and the code is tha same as you

    • @SvenNL.
      @SvenNL. ปีที่แล้ว +1

      Found the solution, try to remove the const from Padding.
      ```
      child: Padding(
      padding: const EdgeInsets.symmetric(horizontal: 15.0, vertical: 20),
      child: GNav(
      onTabChange: (index) {
      print(index);
      },
      gap: 8,
      ```

  • @ilham-t9y
    @ilham-t9y 7 หลายเดือนก่อน

    Why use google navbar instead of the default flutter appbar?

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

    Do you have any idea about how to add drawer widget in navbar?

  • @TopGearTechnics
    @TopGearTechnics 6 หลายเดือนก่อน +1

    Hey KOKO...
    this bottomNavigationBar isn't staying in all other pages when I navigate... How can I maintain this BNB in all other pages when I navigate...

    • @createdbykoko
      @createdbykoko  6 หลายเดือนก่อน

      Watch this first th-cam.com/video/qk-a_Qgc6b0/w-d-xo.htmlsi=_WPv2pAF5EGNDWGa

    • @miniyoongi7
      @miniyoongi7 6 หลายเดือนก่อน

      i have the same issue and i searched a lot for a solution but found nothing ):
      did you find anything helpful so far?

    • @createdbykoko
      @createdbykoko  6 หลายเดือนก่อน

      @@miniyoongi7 watch this first th-cam.com/video/qk-a_Qgc6b0/w-d-xo.htmlsi=cSKFI1Di-_b85BD2

    • @TopGearTechnics
      @TopGearTechnics 6 หลายเดือนก่อน

      @@miniyoongi7 hi, author sent a link, it is helpful for me! Have a look!!

    • @miniyoongi7
      @miniyoongi7 6 หลายเดือนก่อน

      @createdbykoko sorry, my issue is when i am in another page and want to navigate to one of those 4 pages, it comes without Appbar and nav bar because we didn't add it to each, i just don't know how to navigate to this main page with a specific index

  • @sepddy
    @sepddy ปีที่แล้ว

    i want to set mainAxisAlignment to center but make little space between gbuttons , what should i do ? there is no property for that !

  • @codewithprajith
    @codewithprajith 7 หลายเดือนก่อน

    Could I able to navigate to other widgets?

  • @chanukaranathunga6824
    @chanukaranathunga6824 10 หลายเดือนก่อน

    How to display the favourite count?

  • @hellkingaakif
    @hellkingaakif ปีที่แล้ว

    Where can I download this

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

    excellent😍

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

    if i am making the 5 button nav bar then it is overflowing what should I do

    • @michereff16
      @michereff16 ปีที่แล้ว

      I am having the same problem. Did you find a solution?

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

      @@michereff16 no

    • @michereff16
      @michereff16 ปีที่แล้ว

      @@hiteshkumaryadav8373 Wrap the Gnav() with a Container and wrap the Container with Padding()

    • @jayr7505
      @jayr7505 ปีที่แล้ว

      I dont know if anyone still needs this but you should wrap the GNav in a SingleChildScrollView and give it a scroll direction of horizontal

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

    How can I Navigate to different pages?

  • @JagdishOnYT
    @JagdishOnYT ปีที่แล้ว

    How to make persistent bottom nav

  • @zyalwfie
    @zyalwfie 11 หลายเดือนก่อน

    how to fix the gnav is being overflow?

  • @AngelLopez-nc2ib
    @AngelLopez-nc2ib ปีที่แล้ว +1

    is it possible to change the icons to images I downloaded?

    • @apmgaming6854
      @apmgaming6854 ปีที่แล้ว

      if you found out how to do this.
      please share how

  • @galamarciriebi4247
    @galamarciriebi4247 ปีที่แล้ว

    thx guy

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

    Tutorial on Custom painter with animations please..

  • @telmocosta5745
    @telmocosta5745 ปีที่แล้ว

    Is it possible to add a label to a GButton?

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

    i have added 5 icons and getting render flex error on taping 3rd and onwards icons can anyone suggest the solution...

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

    Hi thanks for the video. I am getting when I type: body: _pages:[_selectedIndex]. I get:
    The argument type 'List' can't be assigned to the parameter type 'Widget?'. Someone knows why?

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

      it should be:
      body: _pages[_selectedIndex]
      Look carefully please

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

      @@createdbykoko Oh gosh thanks!! And what if I would insert in the body also a Container with a list, where should I place the _pages[_selectedIndex]?
      Because it tells me that I have Too many positional arguments: 0 expected, but 1 found.

  • @jimcarryus
    @jimcarryus 11 หลายเดือนก่อน

    how to navigation the button?
    i need

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

    you should've used SafeArea instead of Padding

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

    Hi Custom painter series with animation please😅

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

    Great! :)

  • @nathanl6598
    @nathanl6598 2 หลายเดือนก่อน

    It's just another package

  • @giovannylima8637
    @giovannylima8637 ปีที่แล้ว

    top

  • @TestBegmatov
    @TestBegmatov 10 หลายเดือนก่อน

    Почему эта нужен😂😂😂😂😂😂