Getting Started with Navigation in Flutter

Instructor: [00:01] We start off with the basic Flutter application that returns a material app with a home of main app. Main app has two main properties -- the app bar in the body with the body returning a raised button.

[00:14] We'd like to make it so when the user presses on the button, they navigate to another screen. To implement this, we'll first create a new widget called second screen that we'll be navigating to.

[00:25] Second screen also returns a scaffold with an app bar and a body widget.

[00:53] To navigate to this screen, we'll update the on-press handler for the raised button in the main app widget. Here, we'll call navigator.push. Navigator.push takes two arguments -- the context and the route. We'll be creating the route using the material page route class.

[01:10] Material page route replaces the entire screen with the platform adaptive transition. Material page route must take the builder argument which returns the screen we'd like to display.

[01:24] When we click on navigate, we now navigate to the next screen with the sliding transition.

[01:41] We can also call navigator.pop to go back one route in our navigations doc.

[01:54] Let's look at how to pass dynamic arguments to a route. We'll first create a constructor with the arguments that we'd like to receive to this widget. Next, we'll create a variable called title to hold the title value.

[02:17] Now, we'll update the title value in the app bar to be the dynamic value. To set this value, we can now reference it in the argument to second screen setting a title property.