Flutter Tutorial - How To Navigate to New Screen and Back

Flutter Tutorial - How To Navigate to New Screen and Back | Navigator Push/Pop Routes

Рет қаралды 61,862

Күн бұрын

Use Flutter push and pop operations to navigate to a new screen and back by using the Flutter navigator and push with data and arguments and pop routes.
Click here to Subscribe to Johannes Milke: kzfaq.info...
👉 12 Week Flutter Training | heyflutter.com
👉 Flutter Masterclass Courses | heyflutter.com/masterclass
Source Code | github.com/JohannesMilke/navi...
My Courses | heyflutter.com
Follow Newsletter | johannesmilke.com/#/newsletter
SUBSCRIBE HERE
bit.ly/JohannesMilke
SUPPORT & SPONSOR ME
github.com/sponsors/JohannesM...
RESOURCES
Scaffold For Beginners Tutorial: • Flutter Tutorial - Sca...
Passing Data Between Screens & Widgets Tutorial: • Flutter Tutorial - Pas...
Hello World Flutter App Tutorial: • Flutter Tutorial - Hel...
Press Back Again To Exit App Tutorial: • Flutter Tutorial - Pre...
Page Transition Animation Tutorial: • Flutter Tutorial - Pag...
AppBar Tutorial: • Flutter Tutorial - App...
User Profile Page UI Tutorial: • Flutter Tutorial - Use...
Share Texts, Images, Files Tutorial: • Flutter Tutorial - Sha...
Image Slider Tutorial: • Flutter Tutorial - Bui...
Take Screenshots Of Screen Tutorial: • Flutter Tutorial - Tak...
Download File From Firebase Storage Tutorial: • Flutter Tutorial - Dow...
Settings Page UI Tutorial: • Flutter Tutorial - App...
SVG Images Tutorial: • Flutter Tutorial - How...
Set Screen Background Image Tutorial: • Flutter Tutorial - Set...
Cached Network Image Tutorial: • Flutter Tutorial - Cac...
Compress Video Tutorial: • Flutter Tutorial - Com...
Video Player Tutorial: • Flutter Tutorial - Vid...
Drop Files Into Dropzone Tutorial: • Flutter Tutorial - Dra...
TIMELINE
0:00 Introduction Navigate to New Screen and Back
0:30 Push Route / Navigate To New Screen
2:14 Push Route With Data & Parameters
4:11 Pop Route / Navigate Back To Last Screen
5:09 Pop Route With Data To Return Data From Screen
SHARE | SUBSCRIBE | LIKE FOR MORE VIDEOS LIKE THIS
*********
SOCIAL MEDIA: Follow Us :-)
Twitter | / heyflutter_
Linkedin | / heyflutter
LEARN MORE
SOURCE CODE | github.com/JohannesMilke
ARTICLES | / johannesmilke
PLAYLISTS
All Flutter Videos | • Flutter Tutorial - Flu...
Widgets - Flutter | • Flutter Tutorial - Flu...
Plugins - Flutter | • Flutter Tutorial - Flu...
Animations - Flutter | • Flutter Tutorial - Tra...
Designs - Flutter | • Flutter Tutorial - Flu...
Firebase - Flutter | • Flutter Tutorial - Pag...
State Management - Flutter | • Flutter Tutorial - Riv...
CREDITS
Copyright song "Corporate Technology" by scottholmesmusic.com
#Flutter #Tutorial #JohannesMilke
LIKE & SHARE & ACTIVATE THE BELL
Thanks For Watching :-)
bit.ly/JohannesMilke

Пікірлер: 71

@HeyFlutter Жыл бұрын

This might help you :) 👉 12 Week Flutter Training from Newbie to Expert: heyflutter.com Source Code: github.com/JohannesMilke/clone_github_repo_example

@better_notes182 2 ай бұрын

On point, no time wasted. Great video! ❤

@HeyFlutter 2 ай бұрын

Glad to hear that, Thank you @better_notes182! 😊

@emirdikyol8213 2 жыл бұрын

It's an amazing tutorial. Your narrative style is perfect. Thank you very much. Keep going.

@alexsmith9754 2 жыл бұрын

Great explain easy to understand. Thank you for you sharing ❤️

@soispasbet6073 2 жыл бұрын

You help me a lot with your videos ! Thanks !

@enverkilic9226 2 жыл бұрын

Thanks Johannes, really easy guide to understand such things , thanks for your efforts....

@excellencemichel4875 2 жыл бұрын

Thank you for all @Johannes

@cfcr.8090 2 жыл бұрын

Quality Content , Thank you Johannes !

@programmerjowo 2 жыл бұрын

thanks for this very detail tutorial

@eNONO-ot4zh 2 жыл бұрын

nice explication. I understood well this time. thank

@muhammadjunaidbashir8873 2 жыл бұрын

sirrrr what a way of presenting,,,,,really appreciative great

@akshayr6067 2 жыл бұрын

Thank you very much 🙏

@whitebracket Жыл бұрын

Thank you ! direct to the goal !

@HeyFlutter Жыл бұрын

Glad it was helpful, whitebracket! 🙂

@chaitanyapawar5483 2 жыл бұрын

Very nicely explained sir 🙂

@rei-vh4ud 2 жыл бұрын

hi Johannes, thank you for this tutorial! May I know how to preserve states of widget when navigating using this method?

@Sofien_Steve 7 ай бұрын

simple and clear, thank you :D !

@HeyFlutter 6 ай бұрын

Glad to hear that, Thank you @sofienbenktib8970! 😊

@mojtabasaebi6096 2 жыл бұрын

i like that thank you alot

@jk-or7hy 2 жыл бұрын

Thanks for helpful video. How can I go directly into first screen from third screen ? is it possible ? Thanks

@shriramsrinivasan6560 2 жыл бұрын

Hi Johannes Mike, Thanks for the wonderful Video, While reading the Navigator.push() documentation, it could see that Navigator.push() returns a Future event, Generally in flutter, we would add "await" keyword when a function call returns a Future Event, Why don't we add any await keyword before any Navigator.push commands ?

@AmericanuNarcis 2 жыл бұрын

Novadays ,i chuckled a bit

@hammedmessi9286 Жыл бұрын

It;s an amazing tutorial

@HeyFlutter Жыл бұрын

Thank you, Hammed Messi! 🙂

@kamalCode 2 жыл бұрын

Sir, please flutter navigation 2.0

@Raufle1 2 жыл бұрын

print('Really Short, simple, sweet and smooth Thanks'),

@michaelotu9723 2 жыл бұрын

Thumbs up man..

@HeyFlutter 2 жыл бұрын

Thank you, Michael Otu! 🙂

@caioandrade998 Жыл бұрын

THANKS!!!!!!

@HeyFlutter Жыл бұрын

You are welcome, Caio Andrade!

@amandwivedi7413 2 жыл бұрын

Sir, how can I navigate to same page ? Like selecting menu button

@muhammadafzal237 2 жыл бұрын

Nice

@edwardphilipguarin6460 2 жыл бұрын

Hi! sir,, I follow your instructions in Pop,, but I got an error: Error: A non-null value must be returned since the return type 'Future' doesn't allow null. PS: please help me to debug this. Tnx

@Tech1st 2 жыл бұрын

We need getX tutorials

@alieid6254 2 жыл бұрын

Hey man i need your help here , i have been struggling with this, when i use navigator.puah i doesn't show back button on the next page app bar what is the issue , can you help here??

@alieid6254 2 жыл бұрын

@@HeyFlutter yes , no leading initialized on the second page i only have the app bar and it has nothing but the title and still no back button

@kgetgamingentertainmenttec8243 Жыл бұрын

HI i got an error saying the arguement type jsObject cant be assigned to the parameter type BuildContext context has a red line under it in ElevatedButton part of my code

@HeyFlutter Жыл бұрын

Thank You Kirubel Berhanu! Follow this link: stackoverflow.com/questions/53406548/error-dart-the-argument-type-context-cant-be-assigned-to-the-parameter-typ I hope you will get your answer 🙂

@kgetgamingentertainmenttec8243 Жыл бұрын

@@HeyFlutter Thank you for the reply i have solved it already

@abdullahsaid8561 2 жыл бұрын

what happen if my second screen is black. what is the cause

@amirraja7628 2 жыл бұрын

Sir please 🙏🙏🙏 tell me if I want to pop 3 values back how can I do ? Please sir I'm stuck from last 3 days I have watched all ur videos but not found any solution

@Akhi.yt45 Жыл бұрын

Thank you so much sir love you 👏❤️‍🔥❤️‍🔥

@HeyFlutter Жыл бұрын

You are welcome, Akhilesh Rao!

@santhoshs9086 2 жыл бұрын

put video for how to improve flutter web app scrolling performance.I was run my app in chrome the scroll performance not smooth , i behaviour like sloth. so pls ready these type videos

@shakeelakthar3429 Жыл бұрын

When i click device back button from third screen, its going to first screen, but it has to go to second screen. what should I do?

@HeyFlutter Жыл бұрын

Thank You Shakeel Akthar! Follow this link: stackoverflow.com/questions/55265782/android-back-button-keep-bring-me-back-to-first-screen-when-its-pressed-and-didn I hope you will get your answer 🙂

@hamzahawat8092 3 ай бұрын

I have an error !_debugLocked is not true when i want to back to the Previous screen How can i solve it Im sorry but my english is not very good

@HeyFlutter 2 ай бұрын

Thank You @hamzahawat8092! Follow this link: stackoverflow.com/questions/55618717/error-thrown-on-navigator-pop-until-debuglocked-is-not-true I hope you will get your answer 🙂

@wonabe9799 Жыл бұрын

When I click on the back button of the navigation bar it pop's previous page how to stop that

@HeyFlutter Жыл бұрын

Thank You wona be!! Follow this link: stackoverflow.com/questions/45916658/how-to-deactivate-or-override-the-android-back-button-in-flutter I hope you will get your answer 🙂

@wonabe9799 Жыл бұрын

@@HeyFlutter thanks for your help sir

@starynight419 Жыл бұрын

can you pop multiple data in flutter?

@HeyFlutter Жыл бұрын

Thank You Stary Night! Follow this link: stackoverflow.com/questions/57370739/how-do-i-pass-more-than-one-values-using-navigator-pop-method-in-flutter I hope you will get your answer 🙂

@messiisthebest Жыл бұрын

but in my case , without pressing a button , I am navigating to 2nd screen although I push navigation on onpressed function

@HeyFlutter Жыл бұрын

Thank you MESSI, make sure to follow the tutorial step by step 🙂

@canpietaybek Жыл бұрын

Alles sehr gut gemacht bruder! mach weiter, vielleicht versuch doch mal auch ein deutsches video?? DANKE

@HeyFlutter Жыл бұрын

Thanks for the idea, Can Piet! 🙂 I have added it to my list of ideas for future videos!

@canpietaybek Жыл бұрын

@@HeyFlutter thx alot

@TheAmazingPlankton 2 жыл бұрын

Is this the way to navigate after "Google sign in"/firebase screen to the "Home-screen"? I am a noob, sorry 😔

@TheAmazingPlankton 2 жыл бұрын

@@HeyFlutter thank you. How can I usw the navigator. Push without a button...? I mean a delayed switch to another screen.

@abdullahsaid8561 2 жыл бұрын

i got a lot of errors from just copying what u did

@hashankannangara8723 2 жыл бұрын

😎😍🤘

@moehamdan1001 2 жыл бұрын

Any tutorials for camera filters and masks faces like Snapchat

@moehamdan1001 2 жыл бұрын

@@HeyFlutter yes thanks

@simpleengineering2766 2 жыл бұрын

flutter sikhai

@mdshahidali3132 2 жыл бұрын

Nice Video , But Without Animation No Any App Like Much Better For User Experience So When You Create A Next Any Topic Video Please Use Professional Animation Who Not Use AnyOne in Video Please Sir . Thanking You .

@padalaharshitagoud3621 2 жыл бұрын

onTap: () { print("Edit Profile"); Navigator.push( context, MaterialPageRoute( builder: (context) => Second page())); ->This is my first page TextButton( onPressed: () => { Navigator.pop(context,'Continue'), Navigator.push(context, MaterialPageRoute(builder: (context) => FirstPage())), }, ->This is my second page when I click on back button of first page it's showing Second page again. Can you help me with this?