Excellent video tutorials! I much appreciate how pedagogical they are! Clear, simple to follow and with results after each one of your videos. Great Job, thanks for sharing your expertise!
I beg to differ with the routing technique with the drawer, i would supposedly have a different perspective over show the page content in the container in the middle and would also make a different StatelessWidget for the drawer with inherited widget , so i can keep a track of which item is selected.
Rehan Kodekar There is multiple ways to approach this. But as this is more of a Drawer widget and not so much a navigation tutorial, I just kept it simple :)
Bram Vanbilsen agreed with your point, but as I saw you navigated to another page, I would have navigated to the same page and render the text in the empty area, Like the android fragment transactions. Which flutter performs a little bit better on.
Great Video! I would love to see a video about the firebase database with flutter - how to set it up - get data - add data to the database Thanks a lot for all your flutter videos!
Bram, Fantastic video as always. I really appreciate you walking through everything (instead of getting everything correct out-of-the-gate)! I don't know if you're aware (it may just be personal preference) but when you are setting, for example, `onTap` which is a callback you can just do `onTap: switchUser`. You don't have to create a body that invokes `switchUser` (i.e. `onTap: () => switchUser()`). I have subscribed and can't wait to see what else you have in store!
I've seen your quiz app tutorial yesterday and I was hooked! You explain everything so clearly so I know how things work in flutter. Anyway, I've never submitted an Android app before to play store and I am having difficulties right now trying to test uploading the flutter app to the play store. If you can make a tutorial on how to do that, it'll be very great. Thank you so much!
Nice one. Good work. Have a quick couple of questions 1. What if I want to push First and second page over Home page and retain the drawer. Right now, with the way it is, when user lands on first or second page, he has to return back to Home page for any navigation 2. Can this items in the drawer be made dynamic, like say one list for unauthenticated flow and a different list for authenticated flow?
Thanks Bram for this amazing tutorial. I love practicing and learning this amazing tool through your videos to achieve a state where I can start developing me own designs. Thanks Again. Keep 'em coming, YO!!!
Loved it, man! Could you also do a video explaining how to manage user accounts for actual login process? For instance, signing in with Google/Facebook. Would be pretty useful!
Hey Bram, you are a fantastic online educator, i simple love your pace. Im sure you will outcompete all off the india-copycats, no worries. I have an request: Will you make tutorials with Flutter and Firebase (auth, firestore etc.)?
Hello Bram - great demo. I am brand new to Flutter - it looks tremendous. I had recently tried getting into Xamarin but faced too many issues. However, they have a great construct in regards to the 'drawer', and I'd like to know how you'd approach it. Basically, they have what they call a 'master-detail' config, whereby one 'page' contains the drawer, and then has 2 or more 'child' pages which are navigated to via the drawer (plus the 'start' page). The thing is, when nav'ing to the direct children, there is no 'back' button - instead they each display the hamburger. The user basically is 'switching' primary views via the drawer. Once they are on any particular primary page, they can then navigate 'down' into sub-pages, and then use the back button to get back. So, my question is, how would you implement a 'shared' drawer that a handful of 'top level' pages would use? My guess would be that you somehow create a file that contains only the drawer object and then include that into all of the top-level pages? And then, how would things be set up so that the other primary pages do *not* have the back button, but instead the hamburger menu? Is that in the definition of the page, or the method of navigation (from the 'start' page to the other top-level pages)? Thanks and keep up the great work!
This is the first thing that pops into my but I think it is a good approach: You could make the body of your Scaffold of your homepage (or original drawer page) an instance variable of your class. Every time you now click on a button in the drawer, simply call setState and change the body in there. Hope that helps 😊
As always.. great videos Can we do a real life type app? like having services, dependency injection etc. like one product list and order app using firebase. Something like this. It should give everyone a real good taste what to look from flutter..
Hi, you have very good tutorials and very good explanations. I'm a beginner in Flutter and also in Dart, but I've heard about Redux in Flutter. Can you give an example of how to implement this?
Could you make a tutorial video making a flutter app with different widgets on the page in a way that you can scroll down a page. Like an app where some widgets are offscreen (below) and you scroll down to see them and the other ones currently on screen go up as you scroll down and vis versa? Also another idea for a video, I would appreciate if you could make a video of how to make responsive apps to different screen sizes, different orientations, and such? Keep up the good videos. Im gonna play with the github repo for this one to start.
Loved it... Do you have some tutorials about handling internet connection ? I mean not just only have internet or wifi , but how we can know that our user could connect to our API Thanks man...
Bram. Great tutorials. Keep 'em coming. Is there a simple way to set the colour of the status bar in a drawer so that it matches the colour of the status bar of the page it's attached to, do you know?
Sorry for asking but i cant fix this .. any clue? Failed assertion: line 215 pos 12: '!_transitionCompleter.isCompleted': Cannot reuse a MaterialPageRoute after disposing it.
Hello Sir, Could you upload a tutorial on how to use bluetooth functionality of an iPhone using the app, like connecting to a bluetooth device from the app itself?
In VS Code with the Dart Code plugin: - start typing "stf" for stateful widgets, if no auto fill box appears, press ctrl + space. After that press enter. - For stateless widgets, do the same but start typing "stl" instead Hope that helps :)
Hi Bram, thanks for this amazing tutorial!! I am a newbie on Flutter and Dart and I have a doubt concerning the CircleAvatar. In a real world app there would be an option for adding another account, just like in e-mail apps. How could I achieve that? In your example you have used a declarative approach, but my doubt is how to implement it in code. Do you have any idea?
Bram, i saw my first video of your channel and now im thinking to see them at all!. i really want to start learning Flutter, can you show us in a tutorial, how to instal an use Flutter with visual Studio Code, and the android emulator? Clicking "suscribe" in 3..2..1...
Hello Bram, just did your crash course on the quiz app. I really enjoyed it, but just wanted to ask if it would be possible to create something like a Tinder copy with Flutter? Thanks.
Bram Vanbilsen Yes of course, but I have no idea where to start with making it. Should I make a strateful widget that gets information about the users from Firebase?
Can I not push a page that returns a material in the onTap of a list tile? It wasn't working when I tried. Maybe I did something wrong. Can someone please help?
I've been banging my head the last couple of days trying to implement the Drawer and all I had until now were ugly partial results. I just started learning Flutter and dart! Thank you for this excellent tutorial! One question though: would you consider it a good practice to separate the drawer code from the home_page.dart file and implementing it as a class on a separate "drawer.dart" file so that when the drawer grows in complexity, it probably becomes easier to maintain as well as the homepage itself? Would this break anything in your current configuration or make it more difficult?
It most of the times is a good idea to split the code across multiple files! But for these short tutorials, I do not feel like it is necessary. But you should be able to abstract the Drawer code with no problems I believe 😊
Do we need like an internet permission in order to access the network images?, my images seems not to appear, even after using your github code(they're simply blue in color)
Hey man, You are a Great and Your tutorials are amazing. But Can you help me a little? How can I use my sign in Page to directly update the app drawer details? Problems i am facing right now is that. I have a sign in function and 2 classes. 1 that displays app drawer and 1 for login page which calls signinFunction. Now I am not able to get where to place that sign in function. if i make that global then it was unable to use setState function. if i put that in appDrawer class. i am unable to call my signin function from another class Please Help
Awesome work man! Though one question. Why does the new page goes from bottom to top and reverse when you go back? I am just now using the drawer on Viber and it slides left to right. Do you know how to do that? I think it feels closer to the Android style. Thanks!
I cant get why I fuck up in so simple things fucking. spent 3 hours searching for how to use the key I think flutter docs should provide more examples of how to use classes
It is for you not to confuse and turn on the built application, instead of the one in the development version. Comman for building app: "flutter build apk/ios", in built version there is no strip on the right.
hey Bram, I have an installation question (working with Mac). so my editor is VSC. I have installed the plugins (flutter and dart code) but when I am working in a flutter project, I don't get autocomplete of code like you and my code has red lines all over the place. screenshot => gyazo.com/4a135964b26dec6ca40a2d1aeece2cbc . you know what the issue could be?
Pretty sure that is not true. The docs about ListBody state: This widget is rarely used directly. Instead, consider using ListView, which combines a similar layout algorithm with scrolling behavior, or Column, which gives you more flexible control over the layout of a vertical set of boxes.
On older version ListView worked on drawer, but now it only works on Scaffold, Column, Row etc.. Now, when i put it into the Drawer, I can't open it through swipe, and when i click icon that opens drawer, then my screen just get darker and there are errors in console.
I am new to flutter but i am confused in these lecture some one use one type of approach the other use another approach some one help me and dedicate me some tutorial which i followed please help me and save my time please
I do not understand what you are trying to say. People will have different coding styles but the core Flutter concepts remains the same across the board. I do in fact have a crash course for Flutter on my channel if you want one dedicated video.
This is very good tutorial. You debug one by one after writing each code to show us what are the changes occur. Thank you very much.
Bram, you're a life-saver ! You're directly helping me get my first production app off the ground :) keep the tutorials coming - fantastic job !
Excellent video tutorials! I much appreciate how pedagogical they are! Clear, simple to follow and with results after each one of your videos. Great Job, thanks for sharing your expertise!
Awesome! Great Tutorial! I come from a world where such information is not shared easily! Keep it up!
I beg to differ with the routing technique with the drawer, i would supposedly have a different perspective over show the page content in the container in the middle and would also make a different StatelessWidget for the drawer with inherited widget , so i can keep a track of which item is selected.
Rehan Kodekar There is multiple ways to approach this. But as this is more of a Drawer widget and not so much a navigation tutorial, I just kept it simple :)
Bram Vanbilsen agreed with your point, but as I saw you navigated to another page, I would have navigated to the same page and render the text in the empty area, Like the android fragment transactions. Which flutter performs a little bit better on.
Maybe you looking for this.
medium.com/@kashifmin/flutter-setting-up-a-navigation-drawer-with-multiple-fragments-widgets-1914fda3c8a8
Great Video!
I would love to see a video about the firebase database with flutter
- how to set it up
- get data
- add data to the database
Thanks a lot for all your flutter videos!
Very good!
Thanks a lot for sharing it.
I started with Flutter 3 days ago, and have codes and shares like yours helps a lot.
Bram,
Fantastic video as always. I really appreciate you walking through everything (instead of getting everything correct out-of-the-gate)!
I don't know if you're aware (it may just be personal preference) but when you are setting, for example, `onTap` which is a callback you can just do `onTap: switchUser`.
You don't have to create a body that invokes `switchUser` (i.e. `onTap: () => switchUser()`).
I have subscribed and can't wait to see what else you have in store!
Aha woops! Thanks, I didn't think that one through 😄
I've seen your quiz app tutorial yesterday and I was hooked! You explain everything so clearly so I know how things work in flutter. Anyway, I've never submitted an Android app before to play store and I am having difficulties right now trying to test uploading the flutter app to the play store. If you can make a tutorial on how to do that, it'll be very great. Thank you so much!
You just have to build an APK for production. After that, there are no specific Flutter things anymore.
well, thank you for your response. It isn't as simple as iOS, but I finally made it to work. :)
Nice one. Good work. Have a quick couple of questions
1. What if I want to push First and second page over Home page and retain the drawer. Right now, with the way it is, when user lands on first or second page, he has to return back to Home page for any navigation
2. Can this items in the drawer be made dynamic, like say one list for unauthenticated flow and a different list for authenticated flow?
Thanks Bram for this tutorial! Your videos are amazing, keep up the good work!
Wow, I didn't know about UserAccountsDrawerHeader. Big timesaver! Thanks! :)
Thanks Bram for this amazing tutorial. I love practicing and learning this amazing tool through your videos to achieve a state where I can start developing me own designs.
Thanks Again. Keep 'em coming, YO!!!
Loved it, man! Could you also do a video explaining how to manage user accounts for actual login process? For instance, signing in with Google/Facebook. Would be pretty useful!
Any chance you will come back and make more Flutter videos? Your tutorials are hands down the best.
Give me a video idea and I might just start uploading again 😉
And so begins another great video
Awsome tutorial ! Thanks a lot Bram
Bram one more great tutorial....thank you for taking your time to share your knowledge with us...keep up the great work
This looks really good on the ios simulator. Good tutorial for begineers. Thanks!!
Hey Bram, you are a fantastic online educator, i simple love your pace.
Im sure you will outcompete all off the india-copycats, no worries.
I have an request: Will you make tutorials with Flutter and Firebase (auth, firestore etc.)?
I will once my new computer arrives. My current one sounds like a rocket ship when I'm recording 😞
Should arrive in a week or so 😊
Thnx for your valuable knowledge
Can you provide a cheatsheet
Great tutorial. Thanks for covering everything.
You're a GENIUS! THANK YOU VERY MUCH!!!!
Awesome Tut. How would I go about adding an InkWell to the ListView?
Hello Bram - great demo. I am brand new to Flutter - it looks tremendous. I had recently tried getting into Xamarin but faced too many issues. However, they have a great construct in regards to the 'drawer', and I'd like to know how you'd approach it. Basically, they have what they call a 'master-detail' config, whereby one 'page' contains the drawer, and then has 2 or more 'child' pages which are navigated to via the drawer (plus the 'start' page). The thing is, when nav'ing to the direct children, there is no 'back' button - instead they each display the hamburger. The user basically is 'switching' primary views via the drawer. Once they are on any particular primary page, they can then navigate 'down' into sub-pages, and then use the back button to get back. So, my question is, how would you implement a 'shared' drawer that a handful of 'top level' pages would use? My guess would be that you somehow create a file that contains only the drawer object and then include that into all of the top-level pages? And then, how would things be set up so that the other primary pages do *not* have the back button, but instead the hamburger menu? Is that in the definition of the page, or the method of navigation (from the 'start' page to the other top-level pages)? Thanks and keep up the great work!
This is the first thing that pops into my but I think it is a good approach:
You could make the body of your Scaffold of your homepage (or original drawer page) an instance variable of your class. Every time you now click on a button in the drawer, simply call setState and change the body in there.
Hope that helps 😊
As always.. great videos
Can we do a real life type app? like having services, dependency injection etc. like one product list and order app using firebase. Something like this. It should give everyone a real good taste what to look from flutter..
Hi, you have very good tutorials and very good explanations. I'm a beginner in Flutter and also in Dart, but I've heard about Redux in Flutter. Can you give an example of how to implement this?
That was amazing!!!!!!!!!!! Thank you so much!!!!!
Hey Gram! Thank you for these awesome videos. I loved all of them. Can you please make a video of Angular Dart Web Application? Thanks again!
Nice color theme btw
Which set up do you use to record these amazing videos ? the hardware and software
Could you make a tutorial video making a flutter app with different widgets on the page in a way that you can scroll down a page. Like an app where some widgets are offscreen (below) and you scroll down to see them and the other ones currently on screen go up as you scroll down and vis versa? Also another idea for a video, I would appreciate if you could make a video of how to make responsive apps to different screen sizes, different orientations, and such? Keep up the good videos. Im gonna play with the github repo for this one to start.
Loved it... Do you have some tutorials about handling internet connection ? I mean not just only have internet or wifi , but how we can know that our user could connect to our API
Thanks man...
Great tutorial!
Bram. Great tutorials. Keep 'em coming.
Is there a simple way to set the colour of the status bar in a drawer so that it matches the colour of the status bar of the page it's attached to, do you know?
You can set a Theme in the MaterialApp with the color you want 😊
Could you do a tutorial on the AnimatedList? There is only one example and it is not easy to understand.
Fantastic - thanks - these are just GREAT!
Excellent! Thank you
Sorry for asking but i cant fix this .. any clue?
Failed assertion: line 215 pos 12: '!_transitionCompleter.isCompleted': Cannot reuse a MaterialPageRoute after disposing it.
Hello Sir, Could you upload a tutorial on how to use bluetooth functionality of an iPhone using the app, like connecting to a bluetooth device from the app itself?
In your video screen is navigating from bottom to top. How to add pull in and pull animation for screen navigation.
Please do a video of flutter with firebase full features integrated: authentication, database crud , storage...please
what is the shortcut for the auto complete for the class
when you wrote stle then which shortcut you entered ?
In VS Code with the Dart Code plugin:
- start typing "stf" for stateful widgets, if no auto fill box appears, press ctrl + space. After that press enter.
- For stateless widgets, do the same but start typing "stl" instead
Hope that helps :)
Thanks sir,
Butt can u tell me hw set icon on the left side of the ListTitle
Great tutorial! Thanks a lot.
Glad to hear that! Recommendations for new tutorials are greatly appreciated! 😁
Thanks for this really nice tutorial! I'm a new suscriber :)
Thank you for this. Was really useful
great job, very good!
Hi Bram, thanks for this amazing tutorial!! I am a newbie on Flutter and Dart and I have a doubt concerning the CircleAvatar. In a real world app there would be an option for adding another account, just like in e-mail apps. How could I achieve that? In your example you have used a declarative approach, but my doubt is how to implement it in code. Do you have any idea?
you're awesome, thx for the tutorial and keep the good work!!!
If I want to have this drawer to drop down from top when I give slide down finger gesture, then how to do it?
Really big deal, excellent explanation.
I like the tutorial. Can you please do one on swipeRefresh
is there a way to store values locally using flutter and a local database like SQL?
Bram, i saw my first video of your channel and now im thinking to see them at all!. i really want to start learning Flutter, can you show us in a tutorial, how to instal an use Flutter with visual Studio Code, and the android emulator? Clicking "suscribe" in 3..2..1...
That is a good idea for a video! 😊
this is an amazing tutorial
thank you so much
Ótimo video, muito explicativo. Obrigado
What background color theme is that? I like it, reminds me of Atom. Great tutorial
Monokai Pro
Very nice my friend
Hello Bram, just did your crash course on the quiz app. I really enjoyed it, but just wanted to ask if it would be possible to create something like a Tinder copy with Flutter?
Thanks.
I don't see why you wouldn't be 😄
Bram Vanbilsen Yes of course, but I have no idea where to start with making it. Should I make a strateful widget that gets information about the users from Firebase?
Can I not push a page that returns a material in the onTap of a list tile? It wasn't working when I tried. Maybe I did something wrong. Can someone please help?
Great thanks, how I can have a tree list in drawer
Hello Bram, thanks for the tutorial.
Sorry if you already answer that but, which extensions are you using on VSC ?
Thanks
Dart Code, that is it 😊
Oh ok, i thought you got something more ahah.
Thanks keep going ! :)
wow great video you got a new sub
I've been banging my head the last couple of days trying to implement the Drawer and all I had until now were ugly partial results. I just started learning Flutter and dart! Thank you for this excellent tutorial!
One question though: would you consider it a good practice to separate the drawer code from the home_page.dart file and implementing it as a class on a separate "drawer.dart" file so that when the drawer grows in complexity, it probably becomes easier to maintain as well as the homepage itself? Would this break anything in your current configuration or make it more difficult?
It most of the times is a good idea to split the code across multiple files! But for these short tutorials, I do not feel like it is necessary. But you should be able to abstract the Drawer code with no problems I believe 😊
Thank you Bram!
thank you
what does the "new" in code do?
How to connect mobile as an emulator.. while using vs code
Do we need like an internet permission in order to access the network images?,
my images seems not to appear, even after using your github code(they're simply blue in color)
Hey man, You are a Great and Your tutorials are amazing.
But Can you help me a little?
How can I use my sign in Page to directly update the app drawer details?
Problems i am facing right now is that.
I have a sign in function and 2 classes. 1 that displays app drawer and 1 for login page which calls signinFunction.
Now I am not able to get where to place that sign in function.
if i make that global then it was unable to use setState function.
if i put that in appDrawer class. i am unable to call my signin function from another class
Please Help
awesome!!..appreciate work!
what vs code theme are you using?
How to add the sub menu in side bar
awesome.
what's your VSCode theme?
Monokai Pro
Awesome work man! Though one question. Why does the new page goes from bottom to top and reverse when you go back? I am just now using the drawer on Viber and it slides left to right. Do you know how to do that? I think it feels closer to the Android style. Thanks!
The standard Android style apparently is sliding up. It slides from left to right on iOS. You could override this with a custom transition though 😊
Thanks, nice tutorial =)
can you make one on the Dismissible cant figure it out what to do with the key
I cant get why I fuck up in so simple things fucking. spent 3 hours searching for how to use the key I think flutter docs should provide more examples of how to use classes
how can we add login page to this code
do any one know how to show drawer in right side of screen please provide the help
Awesome
Is it possible to combine flutter and java in one android application?
to use java specific functionality.
Yup, you can use channels to communicate with the native side of your Flutter apps 😊
Good video
Is it possible to remove the "preview" strip at the top right?
The slow mode banner?
The brown strip that says "preview" on the top right. Not really sure what it's called.
image.ibb.co/eWKFL7/Pics_Art_03_09_05_03_17.jpg
It is for you not to confuse and turn on the built application, instead of the one in the development version. Comman for building app: "flutter build apk/ios", in built version there is no strip on the right.
Can you show how to make a new site with no new appbar? So one Appbar, one drawer, two sites. Thanks for your work
Sites?
Bram Vanbilsen I mean pages.
In german site and page means exact the same thing.
Just don't use the appBar property in the Scaffold.
How can I align the close button to the bottom of the listview? mainaxisalignment end doesn't work.
Do u use android studio???
Nope, VS Code
hey Bram, I have an installation question (working with Mac). so my editor is VSC. I have installed the plugins (flutter and dart code) but when I am working in a flutter project, I don't get autocomplete of code like you and my code has red lines all over the place. screenshot => gyazo.com/4a135964b26dec6ca40a2d1aeece2cbc . you know what the issue could be?
Perhaps VS Code is still analyzing? You should be able to see a loading indicator at the bottom left of VS Code if it is 😊
Nope nothing is loading, strange -> gyazo.com/9a1f84bacf494e673a139f2cdfb2e509
Weird, are you sure the plugin is enabled?
yes -> gyazo.com/1e0dcb5cc823f8feeeddea5a6f40fd46
Hmm, then I'm not sure. Maybe ask open up an issue on Github. I'm sure Danny will help you :)
After update you should use ListBody, instead of ListView
Pretty sure that is not true. The docs about ListBody state:
This widget is rarely used directly. Instead, consider using ListView, which combines a similar layout algorithm with scrolling behavior, or Column, which gives you more flexible control over the layout of a vertical set of boxes.
On older version ListView worked on drawer, but now it only works on Scaffold, Column, Row etc.. Now, when i put it into the Drawer, I can't open it through swipe, and when i click icon that opens drawer, then my screen just get darker and there are errors in console.
Hello Bram!
Would it be possible to DM you on Twitter, since I have some questions about Flutter? Thanks in advance.
Sure, go for it!
Bram Vanbilsen thanks just followed you, you have to follow back before I can dm you I think
Go to my profile and tap the envelope icon. You should then be able to message me 😊
Bram Vanbilsen I still haven't been able to make it work, any suggestions? Can't see the envelope icon
I am new to flutter but i am confused in these lecture some one use one type of approach
the other use another approach some one help me and dedicate me some tutorial which i followed please help me and save my time please
I do not understand what you are trying to say. People will have different coding styles but the core Flutter concepts remains the same across the board. I do in fact have a crash course for Flutter on my channel if you want one dedicated video.
awesome!!..appreciate work!