Jetpack Navigation: Getting Started

In Add Dependecies Episode, you added Safe Args Gradle Plugin. Safe Args is strongly recommended for navigating and passing data, because it ensures type-safety.

When you add Safe Args plugin, it generates “Directions” class for any destination with actions. For e.g. if MainFragment has any action, it generates MainFragmentDirections

It generates “Args” class for any destination with argument(s). For e.g. if WelcomeFragment receives arguments, it generates WelcomeFragmentArgs

In this episode, you’ll add WelcomeFragment as Destination. You’ll use SafeArgs plugin for Navigation and Passing Arguments while navigating from LoginFragment and SignUpFragment

Open your navigation graph. Click New Destination icon. Select WelcomeFragment. Connect LoginFragment and SignUpFragment to WelcomeFragment in the graph. Switch to code view and confirm the actions added inside LoginFragment and SignUpFragment

Rename this action to actionWelcomeFromLogin

Rename this action to actionWelcomeFromSignUp. Now Switch to Design View.

Select **WelcomeFragment **and click on + icon to right of Arguments in Attributes section.

Give name as param1. Select type as String. Default value as Param1.

Click Add button. Same way, add param2. Now Switch to code view and confirm the arguments added for WelcomeFramgent

Click on Build > Rebuild Project Go to **app > build > generated > source> navigation-args **

Expand login, signup nad welcome packages.

You can see the required Directions and Args classes generated. You’ll use this now to navigate.

Open LoginFragment. Inside OnClickListener of Welcome Button, add the following code:

 v ->
  val action = LoginFragmentDirections.actionWelcomeFromLogin(user, getString(R.string
      .action_logged_in))
  v.findNavController().navigate(action)

Here, first you specify generated directions class.

Then, action id as mentioned in the navigation graph.

In the parantheses, you specify the two arguments as needed by WelcomeFragment. Param1 is user name and Param2 is “Logged In”. Repeat the same steps above for SignUpFragment.

Open SignUpFragment. Inside OnClickListener of Welcome Button, add the following code:

v ->
  val action = SignUpFragmentDirections.actionWelcomeFromSignUp(user, getString(R.string
      .action_signed_up))
  v.findNavController().navigate(action)

Notice, that rest all same, you are passing a different value for Param2. It is “Signed Up” here as you are navigating from Sign up screen. Now Modify WelcomeFragment to receive the Arguments passed.

Open WelcomeFragment. Add following code in onViewCreated after the call to super

arguments?.let {
  val safeArgs = WelcomeFragmentArgs.fromBundle(it)
  param1 = safeArgs.param1
  param2 = safeArgs.param2
}

Here, you are using the generated Args class - WelcomeFragmentArgs to retrieve the arguments passed

and assign them to variables which are used for Updating the display. Build and run the app.

Click on Login Button. Enter Email in valid format and password > 5 characters.

You can confirm successful Navigation with Arguments passed. Confirm the same for Sign up.

Click on Sign Up Button. Enter Full Name, Email in valid format and password > 5 characters.

Again, You can confirm successful Navigation with Arguments passed.